前两天看了别人的文章,涉及到了镂空的展示,所以我在这里把实现的内容写成Swift语言的小Demo,供大家欣赏

首先,需要创建导航视图,然后创建两种展示方式的按钮

let vc = ViewController();
        let nav = UINavigationController.init(rootViewController: vc);
        window?.rootViewController = nav;

override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
        self.title = "两种镂空Demo";
        self.view.backgroundColor = UIColor.whiteColor();
        
        //创建两个按钮
        let btn1 = UIButton.init(frame: CGRectMake(20, 100,screenWidth()-40, 50));
        btn1.setTitle("滑块部分显示与背景不一样的图", forState: .Normal);
        btn1.setTitleColor(UIColor.blueColor(), forState: .Normal);
        btn1.addTarget(self, action:#selector(btn1Click), forControlEvents: .TouchUpInside);
        self.view.addSubview(btn1);
        
        let btn2 = UIButton.init(frame: CGRectMake(20, 180,screenWidth()-40, 50));
        btn2.setTitle("滑块部分显示与背景不一样的图", forState: .Normal);
        btn2.setTitleColor(UIColor.blueColor(), forState: .Normal);
        btn2.addTarget(self, action:#selector(btn2Click), forControlEvents: .TouchUpInside);
        self.view.addSubview(btn2);
        
    }
    //按钮1方法
    func btn1Click(btn:UIButton) {
        let showVC = ShowViewController();
        showVC.typeInt = 1;
        self.navigationController?.pushViewController(showVC, animated: true);
    }
    //按钮2方法
    func btn2Click(btn:UIButton) {
        let showVC = ShowViewController();
        showVC.typeInt = 2;
        self.navigationController?.pushViewController(showVC, animated: true);
    }
    
    //相当于#define
    //返回屏幕宽
    func screenWidth() -> CGFloat {
        return UIScreen.mainScreen().bounds.size.width;
    }
    //返回屏幕高
    func screenHeight() -> CGFloat {
        return UIScreen.mainScreen().bounds.size.height;
    }

我分成了两种展示方式

一种是:滑块部分显示与背景不一样的图

//背景图片
            let backImage = UIImageView.init(frame: CGRectMake(0, 64, screenWidth(), screenHeight()-64));
            backImage.image = UIImage.init(named: "background.jpg");
            self.view.addSubview(backImage);
            
            //背景视图
            bgView = UIView.init(frame: self.view.bounds);
            bgView.backgroundColor = UIColor.clearColor();
            self.view.addSubview(bgView);
            
            //移动视图
            clipView = UIView.init(frame: CGRectMake(0, 64, 180, 180));
            clipView.layer.cornerRadius = 90;
            clipView.layer.masksToBounds = true;
            //设置裁剪
            clipView.clipsToBounds = true;
            //设置交互
            clipView.userInteractionEnabled = true;
            bgView.addSubview(clipView);
            
            //显示图片
            showImgView = UIImageView.init(frame: CGRectMake(0, 0, screenWidth(), screenHeight()-64));
            showImgView.image = UIImage.init(named: "star.jpeg");
            clipView.addSubview(showImgView);
            
            //添加拖动手势
            let panGresture = UIPanGestureRecognizer.init(target: self, action: #selector(panGrestureView));
            clipView.addGestureRecognizer(panGresture);

另一种是:滑块部分显示与背景不一样的图,背景是空白

bgView = UIView.init(frame: self.view.bounds);
            bgView.backgroundColor = UIColor.lightGrayColor();
            self.view.addSubview(bgView);
            
            //移动视图
            clipView = UIView.init(frame: CGRectMake(0, 64, screenWidth()-40, 120));
            //设置裁剪
            clipView.clipsToBounds = true;
            //设置交互
            clipView.userInteractionEnabled = true;
            bgView.addSubview(clipView);
            
            //显示图片
            showImgView = UIImageView.init(frame: CGRectMake(0, 0, screenWidth(), screenHeight()-64));
            showImgView.image = UIImage.init(named: "star.jpeg");
            clipView.addSubview(showImgView);
            
            //添加拖动手势
            let panGresture = UIPanGestureRecognizer.init(target: self, action: #selector(panGrestureView));
            clipView.addGestureRecognizer(panGresture);

展示结果:

         

源码下载:http://download.csdn.net/detail/hbblzjy/9622850

Swift基础之实现一个镂空图片的小Demo的更多相关文章

  1. 【云开发】10分钟零基础学会做一个快递查询微信小程序,快速掌握微信小程序开发技能(轮播图、API请求)

    大家好,我叫小秃僧 这次分享的是10分钟零基础学会做一个快递查询微信小程序,快速掌握开发微信小程序技能. 这篇文章偏基础,特别适合还没有开发过微信小程序的童鞋,一些概念和逻辑我会讲细一点,尽可能用图说 ...

  2. Swift基础之两指拉动图片变大变小

    我们在使用APP的时候,有时会发现有些图片可以通过两指进行放大.缩小,今天就实现这样的一种效果,比较简单,不喜勿喷.... var imageVi:UIImageView! = nil    var ...

  3. 一个iOS图片选择器的DEMO(实现图片添加,宫格排列,图片长按删除,以及图片替换等功能)

    在开发中,经常用到选择多张图片进行上传或作其他处理等等,以下DEMO满足了此功能中的大部分功能,可直接使用到项目中. 主要功能如下: 1,图片九宫格排列(可自动设置) 2,图片长按抖动(仿苹果软件删除 ...

  4. 一个上传图片,预览图片的小demo

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  5. iOS:自己写的一个星级评价的小Demo

    重新整理了下自己星级评价的Demo,可以展示星级评价,可以动态修改星级. github的地址:https://github.com/hunterCold/HYBStarEvaluationView a ...

  6. 一个基于node 的小demo

    首先我们新建一个文件夹  demo-test-node-1 目录目录如下 -- blog_recents.js --template.html --titles.jspn 首先我们新建一个 templ ...

  7. 一个JNI的helloworld小demo

    最近想学习一下jni,在网上看了一些demo,自己也操作了一遍,首先我将我自己学习的demo网站贴出来:https://blog.csdn.net/lwcloud/article/details/78 ...

  8. gulp安装+一个超简单入门小demo

    gulp安装參考.gulp安装參考2. 一.NPM npm是node.js的包管理工具.主要功能是管理.更新.搜索.公布node的包. Gulp是通过npm安装的. 所以首先,须要安装node.js. ...

  9. SpringMVC-拦截器做一个登录认证的小Demo

    拦截器 拦截器的定义 处理器拦截器类似于servlet开发中的filter,用于对处理器进行预处理和后处理. 定义拦截器,实现HandlerInterceptor这个接口 接口的实现需要导入包impo ...

随机推荐

  1. java9学习之模块化

    截止到目前JDK的版本已经更新到10了,虽然java9的生命周期才半年,但是我认为这个版本带来的变革是不可磨灭的,它是第一次深层次的针对架构以及依赖上的革新.下面我们就来学习一下. 一.模块化项目构建 ...

  2. 笔记8 AOP练习2

    场景描述: 一张唱片有好多磁道,假设每个磁道只有一首歌,现在需要记录每首歌的播放次数,然后输出. 主要业务:歌曲播放 辅助功能:记录播放次数(切面) 1.创建唱片接口,CompactDiscs.jav ...

  3. SQL执行SQL语句提示 "内存不足"(insufficient memory....)的解决方法

    由于本地执行的sql script的文件太大但是本地sql的运行内存有限,当我在MSSql的工具上运行这份178M左右的脚本的时候 它会提示 如下错误(Insufficient memory to c ...

  4. Luogu P3740 [HAOI2014]贴海报_线段树

    线段树版的海报 实际上这个与普通的线段树相差不大,只是貌似数据太水,暴力都可以过啊 本来以为要离散的,结果没打就A了 #include<iostream> #include<cstd ...

  5. linux C 刚初始化后的一个变量在调用一个静态库中函数后被异常修改为乱码

    linux C 中声明并初始化一个变量const char a[512]="test";后,接着调用了一个静态库中的函数函数test(b);,a并没有传入test函数,但在调用这个 ...

  6. jQuery 捕获

    jQuery 拥有可操作 HTML 元素和属性的强大方法. jQuery DOM 操作 jQuery 中非常重要的部分,就是操作 DOM 的能力. jQuery 提供一系列与 DOM 相关的方法,这使 ...

  7. 深入理解DirectByteBuffer

    介绍 最近在工作中使用到了DirectBuffer来进行临时数据的存放,由于使用的是堆外内存,省去了数据到内核的拷贝,因此效率比用ByteBuffer要高不少.之前看过许多介绍DirectBuffer ...

  8. mongo 读分析

    分布式读 读冲突 分布式中数据库有多份数据,各份数据可能存在不一致性. mongo 只会写到primary节点上,理论上来说不会有文档冲突,也就是说数据库中的数据都以primary节点为标准. 但是有 ...

  9. jboss规则引擎KIE Drools 6.3.0 Final 教程(3)

    在前2部教程中,介绍了如何在本地运行.drools文件以及使用stateless的方法访问远程repository上的规则. KIE Drools还提供了一种叫有状态-stateful的访问方式. 运 ...

  10. Android简易实战教程--第四十四话《ScrollView和HorizontalScrollView简单使用》

    一.ScrollView 由于手机屏幕的高度有限,当普通布局放不下现实和的内容时,ScrollView视图(滚动视图)就会派上用场,因为数据可以往下滚动显示. 二.HorizontalScrollVi ...