IOS7 UI Transition Guide 状态栏 statusbar

2023-10-25 02:18
文章标签 ui ios7 statusbar 状态栏 guide transition

本文主要是介绍IOS7 UI Transition Guide 状态栏 statusbar，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

Redesign Your App for iOS 7 之 页面布局


iOS7自定义statusbar和navigationbar的若干诡异问题



1. icon 更新到iphone:120X120. ipad:152x152

2. 开机画面要添加回status bar

3. view controller 用full-screen layout

4. 重新设计bar button 图标

5. 按钮要使用无边化

6. 使用相对布局，auto layout，尽量不要写死坐标和大小

7. 用户可自定义字号，字号可调整

8. 注意底部手势的使用，苹果优先响应系统的控制面板

9.尽量去特效化去物理化，保持界面元素平滑和层次感

10. 尽量使用storyboards

11. 在application:didFinishLaunchingWithOp tions:
里判断版本 6 or 7 来载入相关资源

12. 进度和选中状态的window.tintcolor 是应用到整个view,包括subviews.IOS7用barTintColor设置一个bar的背景

13. 自动调整字体字号，dynamic type，用UIFontpreferredFontForTextStyl e去拿一个字体

14. 状态烂透明，其它bar都是半透明的
  UIBarPositionTopAttached
代表bar背景延伸到status bar，图像要64像素高,  UIBarPositionTop代表不延伸，所有bar的按钮都是无边际的

15.status bar,白底黑字：UIStatusBarStyleDefault
黑底白字：UIStatusBarStyleLightCon tent

16. Navigation Bar 默认是半透明，底部有1像素的hairline， tintColor去定义barbutton,用barTintColor去定义bar 背景。如果要用自定义的返回按钮，需要做一个MASK图像作为切换过渡用。 NaviBar的下部阴影要用自定义图像和shadowImage来定义，不要用过长的带阴影部分的图像来做阴影，因为在IOS7上，多出的像素会首先放到statusbar

17. 搜索栏，用tintColor定义引导文字foreground,用barTintColor来定义搜索栏的背景。IOS7可以在UISearchDisplayControlle r里面的displaysSearchBarInNavig ationBar特性，做到把搜索栏集合在NaviBar上面，具体参考系统自带的日历应用
Scope bar范围bar不会自动显示，需要绑定到search bar，tint定义方法同搜索栏类似

18. Tab Bar在ipad上是56像素，用itemPositioning来定义布局，在中央布局时，可以用itemWidth和itemSpacing来自定义布局，tintColor定义选择的items,barTintColor定义背景。可以是使用selectedImageproperty来自定义选中状态的图像

19. Toolbar ，tintColor定义item,barTintColor定义背景，在top边有一条1像素hairline(貌似和别的几个bar有不一样，它们多少底部)，UIToolbarPosition已经弃用了，用UIBarPosition代替

20. barbuttons，使用图像有2种方式UIImageRenderingModeAlwa ysTemplate（默认使用），UIImageRenderingModeAlwa ysOriginal（使用它来设定不是用tinting）

21. activity view controller里的图标要用黑白和透明度表示，抗锯齿处理，不要用dropshadow。图标大小是70x70居中

22. Ios7 的ImageView包含tintColor特性，在UIImageRenderingModeAlwa ysTemplate模式下，tintColor会应用到该图片上

23. 在Ios7上，用MKOverlayRenderer在mapview上创建overlay，3D地图内容参考MKMapCamera

24.IOS7上，用pageViewControllerPrefer redInterfaceOrientationF orPresentation和pageViewControllerSuppor tedInterfaceOrientations 控制pageview

25. iPad上有popover来显示过渡页面，背景半透，同时内容是贴边的

26. ScrollView外观上稍有变化，可以用automaticallyAdjustsScro llViewInsets特性管理srollview 

27.table view在iOS7里变动比较大，cellseparator更细更窄更浅色，同时是从左边开始插入。index默认是白底半透，header的文本显示用all-capitalletters
和footer文本显示用sentence-style
，可以用UITableViewHeaderFooterV iew来自定义样式；
cell组别扩展到整个屏幕宽度，cell选中状态是淡灰底。如果每个cell都有相同尺寸的图像，ios默认自动放置分隔，如果使用混合使用文本和图像，可以用separatorInset（UIEdgeInsets的特性）自定义。

28. text view和webview变动不大，需要注意的是用UIFont里的preferredFontForTextStyl e
取得页面的字体

29.像添加，详细信息，标签，页面控制，时间选择器，进度条（进度条的颜色可以用trackTintColor设置）
，菊花，加减，切换按钮等元素有相当大的变化，

30.圆角按钮IOS7中已经不显示边框，并且用UIButtonTypeSystem代替之前的UIButtonTypeRoundedRect
，（IOS6样式的在新系统里自动转换）

31. Segmentedcontrol分节控制在IOS7里只有简单的样式，以前的segmentedControlStyle的特性已经不用了

32.slider在ios7里面可以用minimumTrackTintColor,maximumTrackTintColor, andthumbTintColor分别设定最小值颜色，最大值颜色，和触摸时颜色。如果设定成nil,就使用默认

33. 切换按钮在ios7里面动感十足，可以用onTintColor, tintColor, andthumbTintColor设置开关和触摸样式

34. actionsheet在ios7里面是一个半透的背景加上无边按钮。应用现在运行的用户自定义样式的as会被弃用，无论如何都是用IOS7的默认样式。在initWithTitle:delegate:cancelButtonTitle:destructiveButtonTitle:otherButtonTitles:方法里面的destructiveButtonTitle系统默认是红色

35. Alert在ios7里面也强制要使用默认样式，如果你提供第三个按钮，将在默认2个按钮的上方显示

这篇关于IOS7 UI Transition Guide 状态栏 statusbar的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/279368。

相关文章

element-ui下拉输入框+resetFields无法回显的问题解决

element-ui下拉输入框+resetFields无法回显的问题解决

《element-ui下拉输入框+resetFields无法回显的问题解决》本文主要介绍了在使用ElementUI的下拉输入框时,点击重置按钮后输入框无法回显数据的问题,具有一定的参考价值,感兴趣的... 目录描述原因问题重现解决方案方法一方法二总结描述第一次进入页面，不做任何操作，点击重置按钮，再进行下
阅读更多...
HarmonyOS学习(七)——UI（五）常用布局总结

HarmonyOS学习(七)——UI（五）常用布局总结

自适应布局 1.1、线性布局（LinearLayout） 通过线性容器Row和Column实现线性布局。Column容器内的子组件按照垂直方向排列，Row组件中的子组件按照水平方向排列。 属性说明space通过space参数设置主轴上子组件的间距，达到各子组件在排列上的等间距效果alignItems设置子组件在交叉轴上的对齐方式，且在各类尺寸屏幕上表现一致，其中交叉轴为垂直时，取值为Vert
阅读更多...
Golang GUI入门——andlabs ui

Golang GUI入门——andlabs ui

官方不提供gui标准库，只好寻求第三方库。 https://github.com/google/gxui 这个gui库是谷歌内部人员提供的，并不是谷歌官方出品，现在停止维护，只好作罢。 第三方gui库 找了好多，也比较了好多，最终决定使用的是还是 https://github.com/andlabs/ui 相信golang gui还会发展的更好，期待更优秀的gui库 由于andlabs
阅读更多...
13 transition数组的动画使用

13 transition数组的动画使用

划重点 动画：transitiontransition-group ：数组动画数组的 添加 / 删除 豆腐粉丝汤 清淡又健康 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><me
阅读更多...
12 动画transition的使用2

12 动画transition的使用2

划重点 Vue 动画：transition / transform在动画周期中执行动动画（上一篇是通过动画样式控制动画） 清蒸扇贝 <!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><
阅读更多...
移动UI：分类列表页、筛选页的设计揭秘。

移动UI：分类列表页、筛选页的设计揭秘。

移动UI的列表页设计需要考虑用户体验和界面美观性，以下是一些建议的设计要点： 1. 列表项的展示： 列表页应该清晰地展示各个列表项，包括标题、副标题、缩略图等内容，以便用户快速浏览和识别。可以使用卡片式布局或者简洁的列表布局。 2. 搜索和筛选： 如果列表项较多，应该提供搜索和筛选功能，方便用户查找感兴趣的内容。搜索框和筛选条件可以放置在页面顶部或者底部，以便用户方便操作。
阅读更多...
UI自动化测试常见面试题

UI自动化测试常见面试题

1、什么是UI自动化测试？ UI自动化测试是一种通过模拟用户交互并自动执行UI操作的软件测试方法。它用于验证用户界面的功能和稳定性，以确保在不同的操作系统、浏览器和设备上的一致性。 2、UI自动化测试的优势和劣势是什么？ 优势： 可以节省时间和成本，提高测试效率。 可以自动执行大量的重复测试任务，减少人为错误。 可以实现广泛的测试覆盖，包括不同的操作系统、浏览器和设备。 可以提供稳定
阅读更多...
iOS如何隐藏系统状态栏

iOS如何隐藏系统状态栏

这里主要说明一下iOS7系统给状态栏的适配及隐藏带来的改变。 变化一： 不隐藏状态栏的情况下，StatusBar会直接显示在当前页面上，当前页面的会延伸到 StatusBar下方，顶到最上头。 这种显示方式在iOS7上是无法改变的，也无法通过设置或者配置类达到iOS6的状态栏效果。       所以在iOS7上进行页面布局的时候要考虑
阅读更多...
element-ui打包之后图标不显示，woff、ttf加载404

element-ui打包之后图标不显示，woff、ttf加载404

1、bug 起因 昨天在 vue 项目中编写 element-ui 的树形结构的表格，发现项目中无法生效，定位问题之后发现项目使用的 element-ui 的版本是 2.4.11 。看了官方最新版本是 2.15.14，然后得知 2.4.11 版本是不支持表格树形结构的。于是决定升级 element-ui 的版本，方便后续的开发。 升级之后本地简单的过了一遍系统功能，并没有发现有什么不妥，于
阅读更多...
Unity(2022.3.41LTS) - UI详细介绍- Toggle(切换)

Unity(2022.3.41LTS) - UI详细介绍- Toggle(切换)

目录 零.简介 一、基本功能 二、属性和设置 三、使用方法 四、优化和注意事项 零.简介 在 Unity 中，Toggle 是一种常用的 UI 组件，用于表示一个布尔值的状态，类似于复选框。 一、基本功能 状态切换：Toggle 有两种状态，即选中和未选中。用户可以通过点击 Toggle 来切换其状态。关联变量：可以将 Toggle 的状态与一个布尔变量关联起来，以便
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2