iOS阅读器与直播的控件重叠滑动交互详解

目录
  • 场景一
  • 场景二
  • 场景三

场景一

进行一个阅读器项目的开发时,遇到了一个问题,

需要在点击绿色区域时弹出一个菜单,因此在该区域加了一个View,

然而,当在这个区域滑动时,滑动手势被绿色区域拦截,手势无法传递到下面的 UIPageViewController 的 View 上

描述

阅读器上方,摇啊摇,出来一个绿色的菜单

要求可以点,也可以拖动

拖动是下方 UIPageViewController 的事情。

手势被绿色视图挡住了,需要一个透传

思路:

把绿色视图的 hitTest View ,交给正在看的阅读器,那一页

这样拖动绿色视图,也可以滑动

class GreenView: UIView{
    override func hitTest(_ point: CGPoint, with event: UIEvent?) -> UIView? {
        var afterThat = next
        while afterThat != nil{
            if let tmp = afterThat as? ViewController{
                if let target = tmp.pagedController.viewControllers?.first{
                    return target.view
                }
            }
            else{
                afterThat = afterThat?.next
            }
        }
        return nil
    }
}

同时要捕捉绿色视图的点击事件,

通过阅读页面的视图控制器,来捕捉

class ContentCtrl: UIViewController {
    override func touchesEnded(_ touches: Set<UITouch>, with event: UIEvent?) {
        if let touch = touches.first, greenFrame.contains(touch.location(in: view)){
            NotificationCenter.default.post(name: .hitGreen, object: nil)
        }
    }
}

场景二

用户在直播室,吃瓜

来了一条重要的消息,必须要用户处理,

用户退出直播室,也要展示,

同时不影响用户给主播送礼物

如上图,用户看到消息,也可以滑动阅读器

( 在消息的区域,滑动无效 )

思路肯定是 window,

脱离控制器,也能展示

实现一,创建新的 window

class MsgWindow: UIWindow {
    init() {
        let originX: CGFloat = 50
        let width = UIScreen.main.bounds.width - originX * 2
        // 窗口大小固定
        super.init(frame: CGRect(x: originX, y: 100, width: width, height: 150))
        clipsToBounds = true
        layer.cornerRadius = 8
        backgroundColor = UIColor.cyan
        // 提升 zIndex
        windowLevel = UIWindow.Level.statusBar + 100
        isHidden = true
    }
    func show(){
         // 展现的必要配置
        if windowScene == nil, let scene = UIApplication.shared.connectedScenes.first as? UIWindowScene{
            windowScene = scene
        }
        isHidden = false
    }
}

实现 2,使用老的 window 和 View

class MsgView: UIView {
    init() {
        let originX: CGFloat = 50
        let width = UIScreen.main.bounds.width - originX * 2
        super.init(frame: CGRect(x: originX, y: 100, width: width, height: 150))
        clipsToBounds = true
        layer.cornerRadius = 8
        backgroundColor = UIColor.cyan
        // 设置 z Index
        layer.zPosition = CGFloat.infinity
        isHidden = true
    }
    func show(){
        // 找到 key window,
        // 把视图,添加上去
        let scenes = UIApplication.shared.connectedScenes
        for sce in scenes{
            if let windowScene = sce as? UIWindowScene, windowScene.activationState == .foregroundActive , let win = windowScene.windows.first{
                isHidden = false
                win.addSubview(self)
                return
            }
        }
    }
}

场景三

用户在直播室,吃瓜

来了一条重要的消息,必须要用户处理,

用户退出直播室,也要展示,

同时不影响用户给主播送礼物

这条消息,很长

( 在消息的区域,滑动有效 )

思路, 扩展场景 2 的第 2 种实现

一句话,限定了响应范围,

重写了 func point(inside

class MsgView: UIView {
    let rect : CGRect = {
        let originX: CGFloat = 50
        let width = UIScreen.main.bounds.width - originX * 2
        return CGRect(x: originX, y: 100, width: width, height: 400)
    }()
    let btnRect = CGRect(x: 10, y: 10, width: 50, height: 50)
    init() {
        super.init(frame: rect)
        clipsToBounds = true
        layer.cornerRadius = 8
        backgroundColor = UIColor.clear
        layer.zPosition = CGFloat.infinity
        isHidden = true
        let bg = UIView(frame: CGRect(origin: .zero, size: rect.size))
        bg.backgroundColor = UIColor.cyan
        bg.alpha = 0.5
        addSubview(bg)
        let btn = UIButton(frame: btnRect)
        btn.backgroundColor = UIColor.red
        btn.layer.cornerRadius = 8
        btn.backgroundColor = UIColor.white
        addSubview(btn)
        btn.addTarget(self, action: #selector(hide), for: .touchUpInside)
    }
    @objc func hide(){
        isHidden = true
    }
    override func point(inside point: CGPoint, with event: UIEvent?) -> Bool {
        return btnRect.contains(point)
    }
}

为啥这条消息,不用 scroll View ?

ha ha

同时,解决了场景一

一般情况下

github repo

到此这篇关于iOS阅读器与直播的控件重叠滑动交互详解的文章就介绍到这了,更多相关iOS重叠滑动内容请搜索我们以前的文章或继续浏览下面的相关文章希望大家以后多多支持我们!

(0)

相关推荐

  • iOS自定义圆形进度提示控件

    iOS中默认的进度条是水平方向的进度条,这往往不能满足我们的需求.但是我们可以自定义类似的圆形的进度提示控件,主要使用iOS中的绘图机制来实现.这里我们要实现一个通过按钮点击然后圆形进度提示不断增加的效果. (1)新建一个Cocoa Touch Class,注意要继承自UIView.这个是绘制图形的类,绘制一个圆形的背景和扇形的进度.具体实现如下: import UIKit class ProgressControl: UIView { override init(frame: CGRect)

  • iOS 简约日历控件EBCalendarView的实现代码

    本文介绍了iOS 简约日历控件EBCalendarView的实现代码,分享给大家,具体如下: EBCalendarView日历控件,调用简单,代码简洁. github地址:https://github.com/woheduole/EBCalendarView 效果图 调用示例 EBCalendarView *calendarView = [[EBCalendarView alloc] initWithFrame:CGRectMake(0, 64, CGRectGetWidth(self.view

  • iOS下拉、上拉刷新控件的封装

    iOS 封装下拉.上拉刷新控件,首先看下效果图: 简单阐述一下:自定义头部.尾部刷新视图,继承UIView,通过KVO监听scrollView的滑动,通过偏移量设置刷新状态,通过修改状态修改scrollView的滚动位置.建一个UIScrollView的分类,添加上拉.下拉刷新及回调的方法,可以让UITableView.UICollectionView直接调用.现在很多应用是在滑动到底部自动进行上拉加载超做,可以在scrollViewDidScroll这个代理方法中手动调用尾部刷新. 下面贴上主

  • iOS 封装导航栏及返回,获取控件所在控制器的实例

    当一个项目发现每个返回的按钮都是一样的,并且标题的字体也不是系统的字体,如果每个页面都去设置返回按钮,重新设置标题字体,这样代码看着繁杂,而且会浪费很多时间,这时候就有必要封装一下了... 首先返回按钮,需要在当前页面pop 到上一个页面的话,有两种方式:一 写一个点击代理,在用到的页面实现它,二 就是获取button所在的当前控制器,然后pop出去. 但是第一个方法,还需要到用到的页面去实现代理,也比较麻烦,那就来说第二种 首先获取当前控制器的方法: UINavigationControlle

  • iOS实现通过按钮添加和删除控件的方法

    本文实例为大家分享了iOS通过按钮添加和删除控件,供大家参考,具体内容如下 想要达到的效果如下: 先讲一下这个demo主要部分,即通过按钮实现增删图标 分析: 1.每一个图标需要两个数据,即图片和描述用的字符串 ,所以创建一个Item类来封装从plist文件读取出来的数据: 1)plist文件如下: 2)Item类: .h文件 #import <Foundation/Foundation.h> @interface Item : NSObject //描述的字符串 @property(nona

  • iOS中各种UI控件属性设置示例代码

    //视图已经加载完了,可以进行ui的添加了 - (void)viewDidLoad { [superviewDidLoad]; // Do any additional setup after loading the view. //初始化UILabel注意指定该对象的位置及大小 UILabel *lb = [[UILabelalloc]initWithFrame:CGRectMake(0,20,300,200)]; //设置文字 lb.text =@"label测试我在学习中学些ui stor

  • iOS自定义时间滚动选择控件

    本文实例为大家分享了iOS自定义时间滚动选择控件的具体代码,供大家参考,具体内容如下 1.先上自定义的控件: /** * 滚轮选择器 * author LH * data 2016/8/20 17:26 */ public class WheelView extends View { public static final String TAG = "WheelView"; /** * 自动回滚到中间的速度 */ public static final float SPEED = 2;

  • iOS自定义日期和数据源选择控件

    需求 App开发中经常会有日期选择(如生日.睡眠定时等)或者省市区选择等此类功能,通常UI中不会单独使用UI中的控件,而是在UIPickerView的基础上增加一个取消和确定按钮 特点 1.支持常见的选择型的数据格式 该控件集成了 yyyy-MM-dd.yyyy-MM.hh mm.省市级联.省市区级联.自定义数据源(2列).自定义数据源(3列)等多种格式 2.即支持UITextField又支持事件触发机制 3.即支持XIB也支持纯代码 效果图 GitHub:XXPickerView 集成 首先将

  • iOS实现高性能简单易用的星星评分控件

    前言 做为老司机的你们有没有遇到过这样的需求?每个商品或者商家的item都有个星级或者其他评分,大概像以下的效果图 实现方案: 大神自己写个通用空间(在时间充足的情况下) 网上找个比较好的第三方 (时间比较紧凑的情况下) 更直接的,自己直接放几个ImageView或者Layer 思考:功能是实现了,但是性能好像有点受影响.具体原因要看第三方框架的实现原理,当然了也有做的很好的.我是个性能控,当我拿到这个需求的时候,也尝试用一些第三方,但结果不尽人意.最后XWStarView就此产生了. XWSt

  • Android开发之无痕过渡下拉刷新控件的实现思路详解

    相信大家已经对下拉刷新熟悉得不能再熟悉了,市面上的下拉刷新琳琅满目,然而有很多在我看来略有缺陷,接下来我将说明一下存在的缺陷问题,然后提供一种思路来解决这一缺陷,废话不多说!往下看嘞! 1.市面一些下拉刷新控件普遍缺陷演示 以直播吧APP为例: 第1种情况: 滑动控件在初始的0位置时,手势往下滑动然后再往上滑动,可以看到滑动到初始位置时滑动控件不能滑动. 原因: 下拉刷新控件响应了触摸事件,后续的一系列事件都由它来处理,当滑动控件到顶端的时候,滑动事件都被下拉刷新控件消费掉了,传递不到它的子控件

  • 微信小程序点击控件修改样式实例详解

    微信小程序点击控件修改样式实例详解 现在要在微信小程序中实现点击控件修改样式,如下: 微信小程序中不支持直接操作dom,要实现这种效果,我们需要通过设置data,然后利用数据和界面的双向绑定来实现它. 第一步:在wxss中定义被点击和未被点击的样式,如下: .service_selection .is_checked{ border: 1px solid #FE0002 ; color: #FE0002 ; background: #fff; } .service_selection .norm

  • 对PyQt5基本窗口控件 QMainWindow的使用详解

    QMainWindow基本介绍 QMainWindow主窗口为用户提供了一个应用程序框架,它有自己的布局,可以在布局中添加控件. 窗口类型介绍 PyQt5中,主要使用以下三个类来创建窗口,可以直接使用,也可以继承后再使用 QMainWindow QWidget QDialog QMainWindow QMainWindow可以包含菜单栏,工具栏,状态栏,标题栏等,是GUI程序的主窗口. 如果我们需要创建主窗口程序,就使用该类. QDialog QDialog是对话框窗口的基类,对话框一般用来执行

  • iOS上下拉刷新控件MJRefresh使用方法详解

    MJRefresh是一个好用的上下拉刷新的控件,github地址如下:https://github.com/CoderMJLee/MJRefresh很多app都使用这个控件,我们也来了解一下它的用法.下面主要是介绍在UITableView下的使用. 使用 在github上下载之后,将MJRefresh文件添加到项目中,并且在需要使用的文件上引入MJRefresh.h.然后在该文件的viewDidLoad方法中指定tableView的header和footer,如下: #import "MJRef

  • Android重要控件SnackBar使用方法详解

    SnackBar是DesignSupportLibrary中的一个重要的控件,用于在界面下面提示一些关键信息,跟Toast不同的地方是SnackBar允许用户向右滑动消除它,同时,也允许在SnackBar中设定一个Action,当用户点击了SnackBar里面的按钮的时候,可以进行一些操作,所以,功能绝对是很强大的. SnackBar的构造: // 参数分别是父容器,提示信息,持续时间public static Snackbar make(@NonNull View view, @NonNull

  • Android控件ListView使用方法详解

    Android控件ListView使用方法介绍,具体如下 一.ListView的简单用法 首先新建一个ListViewTest项目,并让Android Studio自动创建好活动.然后修改activity_main.xml中的代码,如下: <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/re

  • Android如何禁止向EditText控件中输入内容详解

    前言 在Android开发中经常会遇到EditText控件,而在App开发过程中.遇到了这样一个问题.那就是Android EditText控件如何禁止往里面输入内容? 最开始找到修改版解决方法.但是当想输入的时候就有问题了.可以参考一下.但不建议这样写 EditText editText = (EditText) findViewById(R.id.editText1); editText.setKeyListener(null); 看到这个问题大家可能有点奇怪了.EditText的功能不就是

  • Android UI控件ExpandableListView基本用法详解

    ExpandableListView介绍  ExpandableListView的引入  ExpandableListView可以显示一个视图垂直滚动显示两级列表中的条目,这不同于列表视图(ListView).ExpandableListView允许有两个层次:一级列表中有二级列表.  比如在手机设置中,对于分类,有很好的效果.手机版QQ也是这样的效果. 使用ExpandableListView的整体思路 (1)给ExpandableListView设置适配器,那么必须先设置数据源. (2)数据

  • jQuery树控件zTree使用方法详解(一)

    一.节点模糊搜索功能:搜索成功后,自动高亮显示并定位.展开搜索到的节点. 二.节点异步加载:1.点击展开时加载数据:2.选中节点时加载数据. 前台代码如下: js: <script type="text/javascript"> //ztree设置 var setting = { view: { fontCss: getFontCss }, check: { enable: true }, data: { simpleData: { enable: true, idKey:

  • jquery网页日历显示控件calendar3.1使用详解

    关于日历控件,我做了好多次尝试,一直致力于开发一款简单易用的日历控件.我的想法是争取在引用这个控件后,用一行js代码就能做出一个日历,若在加点参数,就能自定义外观和功能丰富多彩的日历.Calendar 3.1是我初步满意的一个作品. 日历的常用场景有两种,一种是用在日期选择器里面,比如某个位置需要输入日期,点一下输入框会弹出一个日历以供选择日期:另一种是单纯的显示作用,在页面某个地方显示日历,一般起装饰作用,很多博客首页都会有这种日历.我前面的随笔介绍的都是第一种日历,而今天要介绍的Calend

随机推荐

其他