当前位置： 移动技术网 > 移动技术>移动开发>IOS > iOS体验性优化之RTL适配右滑返回的实现

iOS体验性优化之RTL适配右滑返回的实现

2019年07月24日  | 移动技术网移动技术  | 我要评论

简述

所谓rtl方向布局就是right to left direction。也就是界面中的元素总是按从右往左的方向进行排列布局，大部分国家的书写以及排列习惯都是从左往右，是ltr方向布局，而对于一些阿拉伯国家，文字的书写以及展示的顺序都是从右往左方向的。

ios的导航支持左滑手势返回上一个界面，这是果粉普遍喜欢的一个特性，ios7之后的app适配大多会保留这一特性，慢慢的大多用户已经有了这种操作习惯，对于iphone的无虚拟键，这种操作也能增加比较友好的用户体验。

在公司新项目之前，没有考虑过多语言rtl的适配方案，开始做的时候ui方面基本实现用一套布局代码支持rtl的两种布局方向。但是真正拿在手里把玩体验时才真切的感受到没有侧滑返回的rtl有多么的不爽。几经查找并没有找到可参考的合适方案，可能国内做多语言适配的技术圈本身就小，适配rtl的就显得更加的稀有了。

希望能帮助到有需要的人，或者有更好的思路可以联系共同探讨。

思路

查不到可参考的资料，只能自己想一想比较合适的方式，恰好在实现一个首页列表跳转详情页时候，解决特殊的转场动画，突然就有了灵感。可能应该有更好的实现方式，现将我的方式展现给大家。

解决方案

1、关键词： uipercentdriveninteractivetransition finishinteractivetransition cancelinteractivetransition

2、关键方法：updateinteractivetransition:

3、实现方式：暂时以文字代码描述，具体可参考之前共享的rtl解决方案，里面有相关源码，末尾处会贴出路径。

具体实现

1、处理navigation代理

使用runtime方式或者基类方式，viewdidappea每次设置nav的代理为自己，viewdiddisappear清空代理(yoins新版中使用rtl框架中的分类)

- (void)rtl_viewwillappear:(bool)animated
{
 [self rtl_viewwillappear:animated];
 self.navigationcontroller.delegate = self;
}
- (void)rtl_viewwilldisappear:(bool)animated
{
 [self rtl_viewwilldisappear:animated];
 if (self.navigationcontroller.delegate == self) {
  self.navigationcontroller.delegate = nil;
 }
}

2、右滑手势添加

基类初始化时，rtl环境下添加右滑手势，关闭左滑手势，实现最基本的右滑返回。

navigation 中实现

- (void)rtl_viewwillappear:(bool)animate
{
// self.view.backgroundcolor = [uicolor whitecolor];
// // do any additional setup after loading the view.
 if (![[rtlmanager appearance]rtl]) {
  self.interactivepopgesturerecognizer.delegate = self;
 }
 self.interactivepopgesturerecognizer.enabled = ![[rtlmanager appearance]rtl];
 
 [self rtl_viewwillappear:animate];
}

3、实现手势交互（重点）

基类vc中 增加一个基础属性，保存临时转场上下文

@property (strong ,nonatomic)uipercentdriveninteractivetransition *transitoncontext;

在vc右滑动作触发事件中，处理转场动画进度

- (void)handlepangesture:(uiscreenedgepangesturerecognizer *)pan
{
// nslog(@"_____%zd-----%zd",self.navigationcontroller.childviewcontrollers.count,self.navigationcontroller.viewcontrollers.count);
// nslog(@"----%@",nsstringfromcgpoint([pan translationinview:self.view]));
 cgfloat progress = abs([pan translationinview:self.view].x) / (self.view.bounds.size.width * 1.0);
 progress = min(1.0, max(0.0, progress));
 if (pan.state == uigesturerecognizerstatebegan) {
  // 创建过渡对象，弹出viewcontroller
  self.transitoncontext = [[uipercentdriveninteractivetransition alloc] init];
  [self.navigationcontroller popviewcontrolleranimated:yes];
 }else if (pan.state == uigesturerecognizerstatechanged) {
  // 更新 interactive transition 的进度
  [self.transitoncontext updateinteractivetransition:progress];
 }else if (pan.state == uigesturerecognizerstateended || pan.state == uigesturerecognizerstatecancelled) {
  // 完成或者取消过渡
  if (progress > 0.5) {
   [self.transitoncontext finishinteractivetransition];
  }
  else {
   [self.transitoncontext cancelinteractivetransition];
  }
  self.transitoncontext = nil;
 }
}
- (id<uiviewcontrollerinteractivetransitioning>)navigationcontroller:(uinavigationcontroller *)navigationcontroller interactioncontrollerforanimationcontroller:(id<uiviewcontrolleranimatedtransitioning>)animationcontroller{
 if (self.transitoncontext) {
  return self.transitoncontext;
 }
 else {
  return nil;
 }
}

最后就是实现自定的各种转场动画了，可以简单模仿系统的滑动切换转场,具体处理在下面vc实现的方法中，返回一个处理转场的实例即可

- (id<uiviewcontrolleranimatedtransitioning>)navigationcontroller:(uinavigationcontroller *)navigationcontroller animationcontrollerforoperation:(uinavigationcontrolleroperation)operation fromviewcontroller:(uiviewcontroller *)fromvc toviewcontroller:(uiviewcontroller *)tovc

4、贴一个简单的动画处理类

@implementation rtlpushanimation

- (nstimeinterval)transitionduration:(id<uiviewcontrollercontexttransitioning>)transitioncontext
{
 return 0.5;
}
- (void)animatetransition:(id<uiviewcontrollercontexttransitioning>)transitioncontext
{
 uiviewcontroller *fromvc = [transitioncontext viewcontrollerforkey:uitransitioncontextfromviewcontrollerkey];
 uiviewcontroller *tovc = [transitioncontext viewcontrollerforkey:uitransitioncontexttoviewcontrollerkey];
 uiview *container = transitioncontext.containerview;
 uiview *tmpv = [fromvc.view snapshotviewafterscreenupdates:yes];
 [container addsubview:tovc.view];
 tovc.view.transform = cgaffinetransformmaketranslation(-tovc.view.bounds.size.width, 0);
 [container addsubview:tmpv];
 [uiview animatewithduration:[self transitionduration:transitioncontext] animations:^{
  tmpv.transform = cgaffinetransformmaketranslation(tovc.view.bounds.size.width, 0);
  tovc.view.transform = cgaffinetransformidentity;
 } completion:^(bool finished) {
  [tmpv removefromsuperview];
  [transitioncontext completetransition:yes];
 }]; 
}
@end
@implementation rtlpopanimation
- (nstimeinterval)transitionduration:(id<uiviewcontrollercontexttransitioning>)transitioncontext
{
 return 0.5;
}
- (void)animatetransition:(id<uiviewcontrollercontexttransitioning>)transitioncontext
{
 uiviewcontroller *fromvc = [transitioncontext viewcontrollerforkey:uitransitioncontextfromviewcontrollerkey];
 uiviewcontroller *tovc = [transitioncontext viewcontrollerforkey:uitransitioncontexttoviewcontrollerkey];
 uiview *container = transitioncontext.containerview;
 uiview *tmpv = [fromvc.view snapshotviewafterscreenupdates:yes];
 [container addsubview:tovc.view];
 tovc.view.transform = cgaffinetransformmaketranslation(tovc.view.bounds.size.width, 0);
 [container addsubview:tmpv];
 [uiview animatewithduration:[self transitionduration:transitioncontext] animations:^{
  tmpv.transform = cgaffinetransformmaketranslation(-tovc.view.bounds.size.width, 0);
  tovc.view.transform = cgaffinetransformidentity;
 } completion:^(bool finished) {
  [tmpv removefromsuperview];
  tovc.view.transform = cgaffinetransformidentity;
  [transitioncontext completetransition:!transitioncontext.transitionwascancelled];
 }];
}
@end

end

大家或许有更好的处理方案，可以一切探讨下。

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，如果有疑问大家可以留言交流，谢谢大家对移动技术网的支持。

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网