如何制作像谷歌地图应用程序一样的滑动面板?

2023-11-24

我正在寻找类似的东西Android滑动面板对于 iOS。我发现MBP下拉控制器,但它需要使用两个 ViewController,并且需要对我正在实现的应用程序的架构进行重大更改。

我只想要在现有视图控制器中添加子视图的东西。我该怎么做呢?


我在 iOS 应用程序中经常使用向上滑动面板,我发现诀窍是将自定义视图添加到故事板(或 xib 文件)中的视图控制器,但设置其框架,使其脱离屏幕。您可以使用以下命令确保视图在任何设备上保持在屏幕之外布局限制.

然后,只需在适当的时候为屏幕上的视图设置动画即可。例如。:

- (IBAction)showPanel:(id)sender
{
    // panelShown is an iVar to track the panel state...
    if (!panelShown) {
        // myConstraint is an IBOutlet to the appropriate constraint...
        // Use this method for iOS 8+ otherwise use a frame based animation...
        myConstraint.constant -= customView.frame.size.height;
        [UIView animateWithDuration:0.5 animations:^{
            [self.view setNeedsLayout];
        }];
    }  
    else { 
        myConstraint.constant += customView.frame.size.height;
        [UIView animateWithDuration:0.5 animations:^{
            [self.view setNeedsLayout];
        }];
    }
}

如果您只想向上/向下滑动即可显示您可以使用的面板UISwipeGestureRecognizer像这样:

- (void)viewDidLoad
{
    [super viewDidLoad];
    // iVar
    swipeUp = [[UISwipeGestureRecognizer alloc] initWithTarget:self action:@selector(didSwipe:)];
    swipeUp.direction = UISwipeGestureRecognizerDirectionUp;
    [self.view addGestureRecognizer:swipeUp];

    // Do the same again with swipeDown using UISwipeGestureRecognizerDirectionDown...
}

- (void)didSwipe:(UIGestureRecognizer *)swipe
{
    if (swipe == swipeUp) {
        // Show panel (see above)...
    } else {
        // Hide panel (see above)...
    }
}

如果您希望面板像打开控制中心一样跟踪您的手指,那么您可以使用UIPanGestureRecognizer并得到translationInView: and velocityInView:并相应调整面板。这是跟踪手指运动的代码片段,但使用touchesBegan:withEvent: - (void)touchesMoved:withEvent: and - (void)touchesEnded:withEvent:中的方法UIViewController给你尝尝:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event
{
    // Don't worry too much about buttonView this is another view that I animate upwards to get out the way of the panel as it slides in from the left...
    [super touchesBegan:touches withEvent:event];
    CGPoint loc = [[touches anyObject] locationInView:self.view];
    // Save last touch for reference...
    lastTouch = loc;
    // leftBeginRect is an area where the user can start to drag the panel...
    // trackFinger defines whether the panel should move with the users gestures or not...
    if (CGRectContainsPoint(leftBeginRect, loc) && canTrack) {
        trackFinger = YES;
    }
    // Left view is a reference to the panel...
    else if (leftView.frame.size.width >= 300) {
        // This means that the panel is shown and therefore should track the user's finger back towards the edge of the screen...
        CGRect frame = CGRectMake(250, 0, 100, self.view.frame.size.height);
        if (CGRectContainsPoint(frame, loc) && canTrack) {
            trackFinger = YES;
        }
    }
}

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
{
    [super touchesMoved:touches withEvent:event];
    CGPoint loc = [[touches anyObject] locationInView:self.view];
    // Need to work out the direction in which the user is panning...
    if (lastTouch.x > loc.x) {
        currentFingerDirection = RHFingerDirectionLeft;
    }
    else {
        currentFingerDirection = RHFingerDirectionRight;
    }
    lastTouch = loc;
    if (trackFinger) {
        if (loc.x <= 300) {
            // This means that the panel is somewhere between fully exposed and closed...
            // This is where the frame for the left view (and the constraints) are adjusted according to the user's current finger position...
            CGRect frame = leftView.frame;
            frame.size.width = loc.x;
            [leftView setFrame:frame];
            leftViewConstraint.constant = loc.x;
            if (loc.x <= 80) {
                float percentage = loc.x / 80;
                int amount = 100 * percentage;
                CGRect otherFrame = buttonView.frame;
                otherFrame.origin.y = -amount;
                [buttonView setFrame:otherFrame];
                constraint.constant = constraintConstant + amount;
            }
        }
        else {
            CGRect frame = leftView.frame;
            frame.size.width = 300;
            [leftView setFrame:frame];
            leftViewConstraint.constant = 300;
            frame = buttonView.frame;
            frame.origin.y = -100;
            [buttonView setFrame:frame];
            constraint.constant = constraintConstant + 100;
            trackFinger = NO;
        }
    }
}

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
{
    // This method works out if the panel should pop open or spring closed when the user ends the gesture...
    [super touchesEnded:touches withEvent:event];
    if (trackFinger) {
        CGPoint loc = [[touches anyObject] locationInView:self.view];
        if (loc.x >= 50 && currentFingerDirection == RHFingerDirectionRight) {
            CGRect frame = leftView.frame;
            frame.size.width = 300;
            leftViewConstraint.constant = 300;
            CGRect otherFrame = buttonView.frame;
            otherFrame.origin.y = -100;
            constraint.constant = constraintConstant + 100;
            [UIView animateWithDuration:0.2 animations:^{
                [leftView setFrame:frame];
                [buttonView setFrame:otherFrame];
            }];
        }
        else if (loc.x <= 250 && currentFingerDirection == RHFingerDirectionLeft) {
            CGRect frame = leftView.frame;
            frame.size.width = 0;
            leftViewConstraint.constant = 0;
            CGRect otherFrame = buttonView.frame;
            otherFrame.origin.y = 0;
            constraint.constant = constraintConstant;
            [UIView animateWithDuration:0.2 animations:^{
                [leftView setFrame:frame];
                [buttonView setFrame:otherFrame];
            }];
        }
        else if (loc.x <= 150) {
            CGRect frame = leftView.frame;
            frame.size.width = 0;
            leftViewConstraint.constant = 0;
            CGRect otherFrame = buttonView.frame;
            otherFrame.origin.y = 0;
            constraint.constant = constraintConstant;
            [UIView animateWithDuration:0.2 animations:^{
                [leftView setFrame:frame];
                [buttonView setFrame:otherFrame];
            }];
        }
        else {
            CGRect frame = leftView.frame;
            frame.size.width = 300;
            leftViewConstraint.constant = 300;
            CGRect otherFrame = buttonView.frame;
            otherFrame.origin.y = -100;
            constraint.constant = constraintConstant + 100;
            [UIView animateWithDuration:0.2 animations:^{
                [leftView setFrame:frame];
                [buttonView setFrame:otherFrame];
            }];
        }
        trackFinger = NO;
    }
    currentFingerDirection = RHFingerDirectionNone;
}

该代码非常复杂,但它会产生一个漂亮的面板动画,就像控制中心一样跟随您的手指。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何制作像谷歌地图应用程序一样的滑动面板? 的相关文章

随机推荐

  • 如何通过名称获取控件名称?

    我有一个简单的功能 其中有一个组合框 如果组合框的值等于 禁用 我将禁用文本框 B 有许多组合框及其相应的文本框 B 按行排列并手动命名 如果组合框 A 被命名为Product1 文本框B将被命名Product1 status 我在想这样的
  • 如何在数据库android中存储图像[重复]

    这个问题在这里已经有答案了 我是 android 新手 我正在创建一个联系人管理器 我已经弄清楚如何将 EditText 字段中的值存储到数据库中 但我不知道如何在数据库中存储图像 我想知道是否有人可以帮助我解决这个问题 package a
  • JavaMail BaseEncode64 错误

    我目前正在开发一个从 gmail 帐户下载附件的应用程序 现在 每次下载压缩附件时都会出错 但是 并非全部 有些我可以毫无错误地检索它 这是异常消息 Exception in thread main com sun mail util De
  • 根据键值删除日期早于所需日期点的行

    我有一个 pd dataframe 如下所示 key value date value 01 2017 01 13 value 01 2018 02 17 value 01 2018 04 02 value 01 2018 05 13 va
  • iOS 7 -- navigationController 正在设置我的 UIScrollView 的 contentInset 和 ContentOffset

    我有一个 UIScrollView 实际上是一个 UICollectionView 但这可能并不重要 当它出现在 IOS 7 中时 导航控制器将其 contentInset 和 contentOffset 设置为我不想要的值 它似乎正在尝试
  • Rails 格式验证——字母数字,但不是纯数字

    测试用户名格式验证的最佳方法是什么 使用字母数字的正则表达式 但不是纯数字 我一直在我的模型中使用以下验证 validates username format gt with gt a z0 9 a z0 9 a z0 9 i 数字用户名
  • 如何在 Python 中使用 ruamel.yaml 从 YAML 文件中获取注释?

    我想从使用加载的 YAML 文件中获取注释字符串ruamel yaml The 项目文件缺少 API 参考 我找不到相关示例 访问评论的正确方式是什么 import ruamel yaml yaml YAML 1 2 C1 a C2 C3
  • Python string.join ( list ) 最后一个条目带有“and”

    有什么优雅的方法可以连接句子部分列表 使结果为 a b 和 c 其中list is a b c 简单指定 join 仅实现 a b c 另外 我确实对此进行了一些搜索 但显然我没有尝试编写短语 因为除了自己枚举列表之外 我还没有想出任何东西
  • 如何在 Javascript 中提取本地图像的元数据?

    我想获取用户拖放到网页中的图像的元数据 我已经设置了拖放功能 但是 图像实际上并未上传到服务器 它是在本地访问的 我仍然可以使用 Javascript 从图像中获取元数据吗 如果是这样 我该怎么做 有哪些好的图书馆 如果没有 我是否必须上传
  • 如何从 C# 中的二维数组中删除行和列?

    如何在 C 中删除二维数组中的特定行和列 int array 1 2 3 4 5 6 7 8 9 假设我想删除第 i 行和第 i 列 跳过它们 对于 nXn 数组而不仅仅是 3x3 并将剩余的数组存储在新数组中 所以输出将是 5 6 8 9
  • 有没有办法检查两个数组是否具有相同的元素?

    假设我有 2 个数组 firstArray 1 2 3 4 5 secondArray 5 4 3 2 1 我想知道它们是否包含相同的元素 而顺序并不重要 我知道我可以编写一个函数对它们进行排序 然后循环遍历它们进行检查 但是是否有为此预先
  • 获取维恩图中的项目列表

    使用以下代码很容易绘制维恩图 library VennDiagram set seed 1 For reproducibility of results xx 1 lt list A sample LETTERS 15 B sample L
  • 通过 IP 访问 IISExpress 以获取 ASP.NET Core API

    我有一个在 IIS Express 上运行的 asp net core 项目 网址 http 本地主机 53142 and https 本地主机 44374 如果我在浏览器中输入本地主机 则可以工作 但是 如果我输入我的 IPv4 IP 地
  • mysql - 查询三个表

    我有一个包含三个表的关系数据库 第一个包含与第二个相关的 id 第二个包含与第三个相关的 id 第三个包含我想要的结果 是否可以使用单个查询来查询第一个表中的 id 该 id 给出了第三个表中与之相关的所有结果 抱歉 我是 mySQL 新手
  • CompletableFuture 和垃圾收集

    我想触发许多一次性异步 CompletableFutures 如下所示 for Job job jobs CompletableFuture supplyAsync gt job process whenComplete this doSo
  • ASMX Web 服务未序列化抽象基类

    我有一个抽象类 我们称之为生命体 它看起来像 public abstract class Lifeform public virtual int Legs get set public virtual int Arms get set pu
  • 如何在Bigcommerce中通过sku id更新产品的“inventory_level”?

    我正在尝试更新产品的库存水平 但不幸的是没有成功 这是我的代码 我想更新产品的 inventory level 但可以这样做
  • 多个远程数据库,单个本地数据库(花式复制)

    我有一个管理用户的 PouchDB 应用程序 用户拥有一个使用单个 CouchDB 数据库进行复制的本地 PouchDB 实例 很简单 这就是事情变得有点复杂的地方 我正在将 组 的概念引入到我的设计中 组将是不同的 CouchDB 数据库
  • 接口和抽象类有什么区别? [复制]

    这个问题在这里已经有答案了 可能的重复 接口与抽象类 一般 OO 我不太清楚其中的区别 Thanks 它们非常相似 但存在一些重要的技术差异 抽象类允许您为某些方法提供默认实现 但接口不允许您提供任何实现 你可以实现多个接口 但只能继承一个
  • 如何制作像谷歌地图应用程序一样的滑动面板?

    我正在寻找类似的东西Android滑动面板对于 iOS 我发现MBP下拉控制器 但它需要使用两个 ViewController 并且需要对我正在实现的应用程序的架构进行重大更改 我只想要在现有视图控制器中添加子视图的东西 我该怎么做呢 我在