您的位置：
单手“下拉悬停”：锤子完胜魅族
作者：郝晓茹
　　当他狂妄地说出&这个行业唯一的聪明人死了&这句话时，几乎所有人都觉得他是吹牛、是营销目的、是赚眼球。但在改进大屏手机单手操作体验这件事上，罗永浩让我相信了他是手机行业聪明人的说法，不过，是很多聪明人中的一个。我愿意给罗永浩鼓掌，尽管他不缺掌声。
　　单手操作模式
　　手机屏幕越大，单手操作就越不方便。目前手机厂商给出的常见改进方案包括：
　　1.画中画。
　　使用的厂商：vivo、Nubia、三星(非全局)等。
　　体验：与正常模式的切换比较麻烦，大部分人懒得用。
　　2.可调节的软件界面，比如联想的&水银键盘&。
　　使用的厂商：联想、华为以及一些app开发商
　　体验：只能在拨号等几个特定界面使用，局限性大。
　　(图/太平洋电脑网)
　　第三种是本文重点：下拉悬停
　　看看先发布的魅族是怎么做的。
　　(图/雷锋网)
　　再看看锤子是怎么做的。
　　(图/根据ifanr视频制作)
　　魅族的专利号是.7，名称&列表组件显示方法和终端&，申请日期2013.08，公告日期2013.12。
　　锤子的专利号是.8，名称&一种移动设备的窗口移动方法及其装置&，申请日期2013.06，公告日期2013.09。
　　魅族的下拉悬停好用吗?答案恐怕是鸡肋。(作者：雷锋网 郝晓茹)
　　&还有这个功能?&
　　&来，我给你演示一下!&
　　&哦，算了，还不如不知道呢!&
　　锤子呢?新浪科技的评价很中肯：
　　锤子的方式很讨巧，通过拇指大面积压住屏幕下拉，可将整个屏幕向下拖拽至中部，也就将顶部的按钮更向底部靠拢方便点击。
　　整个过程并不费劲，初次使用时成功概率不高，不过掌握技巧后还是非常顺手。最理想的是，按住屏幕后不要急于下拉，而做稍许停顿。另外，设置中也有触发面积的选项，可根据个人的拇指大小选择。
　　如果熟练使用后，你会不自然在需要时激活这一功能。尤其当坐地铁一手需要握紧栏杆，一手操作手机的时候，拇指下拉，屏幕下沉，点击需要的内容后，屏幕会自动上弹为原有样式，一气呵成。
　　锤子胜过魅族的原因
　　看完两者的公开专利文件后，这个答案就揭开了。魅族输得好惨、好惨、好惨&&罗永浩（专利发明人）真TMD是个聪明人，尤其在人机交互、人机界面方面。
　　魅族激活&下拉悬停&的条件是：&列表&离开原位置一定距离，并且保持一定时间。
　　锤子激活&下拉悬停&的条件是：手指触发面积达到一定大小，然后发生位置变化(就是向下拉)。
　　(图/新浪科技)
　　魅族为触发条件设定了两个阈值，都是普通人没有感觉的值，它恨不得拿把尺子，量量你&下拉&了多远的距离，用秒表来计算你在那儿停留了多久，然后才激活&悬停&功能;锤子呢，只有一个阈值&&手指抹到屏幕上的大小，普通人是有感觉的。把手指抹上去，向下一拉就可以了。
　　体验甩出一条街
　　锤子触发动作，易用性强;魅族触发动作，易用性弱。
　　锤子是把整个屏幕(窗口)移动了;魅族是移动了&列表&(选项)的位置。
　　锤子是全局可用的;魅族不知道哪里可以用这个功能，哪里不可以用。
　　锤子是可以设置&触发面积&大小的;魅族手机没有提供设置入口。
　　锤子怕误触的话，可以关掉，而且默认是关闭的;魅族默认是开启的，关也关不掉。
(转载请保留)
热门话题大家都在看
互联网的一些事，已超50万小伙伴关注！在线时间3 小时
版本3.6.21
积分 28, 距离下一级还需 22 积分
积分 28, 距离下一级还需 22 积分
机型Samsung I9300
MIUI版本3.6.21
来自网页版
某天做着白日梦瞎想，想到了一个我觉得很给力的解决大屏幕打手操作难的方法。作为一个搞学术的苦逼，也想搞点开发，可是真是没时间啊，放在这里给大家共享吧。
如第一个图所示，假如我们想要点击左上角的菜单键，我们就从对角线位置（也就是右下角）往屏幕中间滑动。然后一个映射左上角的小屏幕出现在了右下角，当然，按键也同样映射过来。然后只需要在这个右下角的小屏幕点击即可。
类似的，假如想点击右上角的按键，就从左下角网屏幕中间滑动。如第二个图所示。
当然这种从底部往上滑动，很可能会和应用本身的上滑操作冲突。所以我这里用的是从Return键和Recent键向屏幕中心滑动。据我所知，这个操作应该是没有什么冲突的。当然我做的动画很粗糙，真正实现的时候，下屏幕出现的大小范围、位置应该是根据用户滑动的距离位置变化的，同时可以加一些透明和毛玻璃特效，我觉得做成以后应该会挺酷的。
下面说一下优势吧。
1. 全局化：无需应用适配，系统级全局使用。（秒杀了魅族的下拉悬停）
2. 无需变动手的姿势：点击的范围是常用的后退键、最近程序键、屏幕中心，且是正常的指尖点击。（秒杀了锤子的手指抹）
3. 快速！！！：通过简单上滑即可调出小屏幕，同时上滑后，手指基本在原地点击即可。而下拉的话，需要先有下拉动作，导致手指到屏幕底部，再点击的时候，手指有得上移。不要小看这一点点的区别，操作的速度感觉会差很多。（再次秒杀魅族和锤子的方法）
4. 不影响屏幕内容显示：需要时调出小屏幕即可，平时不影响使用，所以不会像oppo小屏幕那样为了单手操作而丧失了大屏幕的优势。（秒杀了oppo）
不知道这里写，MIUI的开发们看得见不~~
小米这么久都没有对大屏幕优化，是不是憋大招呢？可以参考参考我这个方法哈~~~~~
(78.01 KB, 下载次数: 3)
16:42 上传
(146.57 KB, 下载次数: 3)
16:42 上传
分享到微信朋友圈
打开微信，点击底部的“发现”，使用 “扫一扫” 即可将网页分享到我的朋友圈。
已关联2个BUG提交人处理状态
经验1138 米
在线时间94 小时
版本6.8.11
积分 1333, 距离下一级还需 667 积分
积分 1333, 距离下一级还需 667 积分
机型小米手机3-WCDMA/CDMA版
签到次数47
MIUI版本6.8.11
通过手机发布
牛，赞，这想法不错。
已关注微信
关注腾讯微博
已关注腾讯微博
关注新浪微博
已关注新浪微博
Copyright (C) 2016 MIUI
京ICP备号 | 京公网安备34号 | 京ICP证110507号axure（7）
axure7（7）
这是一个赤裸裸炫技的帖子，*_^，结合常见社交应用的用户中心里的下拉效果，晒一下如何通过axure来实现，炫的最终目的也就是提高使用axure的技能。
如果你不知道这个功能，你可以打开新浪微博手机客户端，或者手机淘宝客户端，进入用户中心，下拉一下试试。
要炫的技能点如下：
1、如何将整体视图居中设置
2、如何通过设置动态面板的背景来缩放图片
3、如何使用自定义全局变量和局部变量
一、如何将整体视图居中设置
如果你设计的原型图是固定大小，比如400像素宽的，但你想在不同分辨率的电脑上演示时，原型在浏览器里是居中显示的，而且随着窗口的大小改变要始终保持在界面中间，要如何实现呢？例如下图你肯定希望它能像右边那边居中显示
1、将原型所有元素转成动态面板，起名main，便于后面移动它
2、给页面加载和窗口大小改变事件添加代码，如下：
3、代码分析
其实就是在页面加载时，以及窗口改变大小时，移动动态面板main到屏幕中央位置即可。
这里注意局部变量的使用，局部变量设置为部件main，这样可以在上面的
位置计算：就是当前屏幕的宽带送去动态面板的宽度，再除以2，就是居中的x位置。
二、如何通过设置动态面板的背景来缩放图片
动态面板有个背景设置的功能，背景可以以完全填充，或者平铺等方式设置，当动态面板大小发生变化时，背景图片会自动处理。这可以让我们用它来缩放图片处理，正常的手法来缩放图片还不好处理呢。
注意在这里设置“重复”为“拉伸以覆盖”，设置完后，你可以试着改变动态面板的大小。
三、如何使用自定义全局变量和局部变量
好了，现在开始实现下拉缩放效果
1、准备环境：添加个手机界面样式，转成动态面板main，然后按第一点，给页面添加加载和改变大小事件
2、在main里添加个动态面板，取名header，双击后进入，设置它的背景，按上面第二点说的
3、关键的地方来了，给动态面板添加拖动事件
事件说明：
1）用例3：在动态面板宽度小于450时，设置动态面板为原大小，即不要改变了
2）用例1：当前光标大于历史的光标的y位置，则改变动态面板大小的宽带和高度，分别增加3个像素，然后把动态面板header移动到居中位置，最后保存当前光标的y坐标，便于比较
3）用例2：其实就是用例1的反向操作，用例1和用例2是用来模拟鼠标按下后向下或向上拖动时的缩放操作。
4）这里的oldY是全局变量，LVAR1在每个用例里是局部变量
另注意点：为了防止入缩的图片自动调整动态面板大小，设置一下动态面板main的“调整大小以适合内容”为非勾选状态。
参考知识库
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：23353次
排名：千里之外简单实现下拉图片放大① - 全屏手势 - 简书
简单实现下拉图片放大① - 全屏手势
工作变化.jpg
简单实现下拉图片放大iOS - 面试时有力的谈资 运行时你值得拥有,大神勿喷
简单实现下拉图片放大① - 全屏手势
Untitled3.gif
1.全屏手势的实现
#import &objc/runtime.h&
运行时关联对象 添加属性UIPanGestureRecognizer交互手势
//懒加载 初始化UIPanGestureRecognizer交互手势
- (UIPanGestureRecognizer *)hm_popGestureRecognizer {
UIPanGestureRecognizer *panGestureRecognizer = objc_getAssociatedObject(self, _cmd);
if (panGestureRecognizer == nil) {
panGestureRecognizer = [[UIPanGestureRecognizer alloc] init];
panGestureRecognizer.maximumNumberOfTouches = 1;
//分类中使用 运行时关联对象 添加属性
objc_setAssociatedObject(self, _cmd, panGestureRecognizer, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
return panGestureR
判断是否手势的触发
- (BOOL)gestureRecognizerShouldBegin:(UIPanGestureRecognizer *)gestureRecognizer {
//判断根视图的数量 是否可用使用手势返回
if (self.navigationController.viewControllers.count &= 1) {
return NO;
//KVC判断如果正在转场动画 取消手势
if ([[self.navigationController valueForKey:@"_isTransitioning"] boolValue]) {
return NO;
//判断手指移动方向
CGPoint translation = [gestureRecognizer translationInView:gestureRecognizer.view];
if (translation.x &= 0) {
return NO;
return YES;
swizzledMethod
使用运行时的交换方法 替换系统的 pushViewController:animated:方法
+ (void)load {
Method originalMethod = class_getInstanceMethod([self class], @selector(pushViewController:animated:));
Method swizzledMethod = class_getInstanceMethod([self class], @selector(hm_pushViewController:animated:));
//替换系统的 pushViewController:animated:方法
method_exchangeImplementations(originalMethod, swizzledMethod);
实现自己的含手势的pop方法
- (void)hm_pushViewController:(UIViewController *)viewController animated:(BOOL)animated {
//在所有的交互手势中查找 如果没有就添加
if (![self.interactivePopGestureRecognizer.view.gestureRecognizers containsObject:self.hm_popGestureRecognizer]) {
[self.interactivePopGestureRecognizer.view addGestureRecognizer:self.hm_popGestureRecognizer];
NSArray *targets = [self.interactivePopGestureRecognizer valueForKey:@"targets"];
id internalTarget = [targets.firstObject valueForKey:@"target"];
//拦截所有的系统手势方法 handleNavigationTransition
SEL internalAction = NSSelectorFromString(@"handleNavigationTransition:");
self.hm_popGestureRecognizer.delegate = [self hm_fullScreenPopGestureRecognizerDelegate];
[self.hm_popGestureRecognizer addTarget:internalTarget action:internalAction];
// 禁用系统的交互手势
self.interactivePopGestureRecognizer.enabled = NO;
if (![self.viewControllers containsObject:viewController]) {
[self hm_pushViewController:viewController animated:animated];
获取下面内容 请点击上面链接
上滑图片渐变消失
状态栏的颜色根据图片alpha改变