当前位置: 移动技术网 > IT编程>移动开发>IOS > 详解iOS11关于导航栏问题

详解iOS11关于导航栏问题

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

冰帝校园行txt下载,清新桌面主题,编辑出版学专业

前言

ios11导航栏除了新加入了largetitles和searchcontroller两个新特性,可能是加入largetitles的原因其结构较ios 10发生了些变化。

ios11之前导航栏的navigationbarbutton则直接添加在navigationbar上面

在ios11之后,苹果添加了新的类来管理,可以看到titleview直接加在_uinavigationbarcontentview上,uibarbuttonitem则添加在_uibuttonbarstackview上面,而_uibuttonbarstackview则添加在_uinavigationbarcontentview上面,最后添加到uinavigationbar上面,如下图所示:

由于结构的变化,在ios 11中我们自定义设置leftbarbuttonitem,其点击区域变得很小,让人点的很焦灼,如下图绿色区域所示:


具体代码如下,设置的frame在这里并没有什么卵用,点击区域依然只有图片原本的size那么大:

    uibutton *btn = [[uibutton alloc] initwithframe:cgrectmake(0, 0, 60, 40)];
    [btn setimage:imagewhite forstate:uicontrolstatenormal];
    [btn addtarget:self action:@selector(bpback) forcontrolevents:uicontroleventtouchupinside];
    btn.backgroundcolor = [uicolor greencolor];
    uibarbuttonitem *leftitem = [[uibarbuttonitem alloc] initwithcustomview:btn];
    leftitem.width = 60;
    self.navigationitem.leftbarbuttonitem = leftitem;

为了能增加点击区域,我们就需要增加button的size,然后就想到通过改变contentedgeinsets来增大button的size,

... 
...
 btn.backgroundcolor = [uicolor greencolor];
 if (@available(ios 11.0,*)) {
     [btn setcontentmode:uiviewcontentmodescaletofill];
     [btn setcontentedgeinsets:uiedgeinsetsmake(0, 5, 5, 20)];
  }
 uibarbuttonitem *leftitem = [[uibarbuttonitem alloc] initwithcustomview:btn];
...
...

另:searchbar设置为titleview,会导致navigation的高度发生异常(ps:push到下一个界面,下个界面的view距离navigation出现了一段黑色区域)需要处理下:

  cgrect frame = cgrectmake(0, 0, 150, 44);
  uisearchbar *search = [[uisearchbar alloc] initwithframe:frame];
  search.placeholder = @"搜索";
  search.delegate = self;
  uitextfield *searchfield=[search valueforkey:@"_searchfield"];
  searchfield.backgroundcolor = [uicolor grouptableviewbackgroundcolor];
// --- ios 11异常处理
  if(@available(ios 11.0, *)) {
    [[search.heightanchor constraintequaltoconstant:44] setactive:yes];
  }
  self.navigationitem.titleview = search;

详细资料参考:

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持移动技术网。

如对本文有疑问,请在下面进行留言讨论,广大热心网友会与你互动!! 点击进行留言回复

相关文章:

验证码:
移动技术网