首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

iOS 11 更大的导航 (官方翻译版)

导航栏 导航栏出现在应用程序屏幕顶部的状态栏下方,并可以通过一系列分层屏幕进行导航。当显示新屏幕时,通常标有前一屏幕标题的后退按钮出现在栏的左侧。...导航栏是半透明的,可能具有背景色调,并且可以配置为在屏幕上键入屏幕时隐藏,发生手势或视图调整大小。 ? 考虑在显示全屏内容时暂时隐藏导航栏。当您想关注内容时,导航栏可能会分散注意力。...当用户开始滚动内容时,大标题转换为标准标题。大标题在所有应用程序中都没有意义,不应与内容竞争。虽然Clock应用程序具有标签式布局,但是大型标题是不必要的,因为每个标签都有一个不同的,可识别的布局。...如果您在导航栏中使用分段控件,则该栏不应包含标题或除分段控件之外的任何控件。 使用标准后退按钮。人们知道标准的后退按钮可以让他们通过信息层次来回溯步骤。...iOS在使用此遮罩时,可以在转换期间为按钮标题设置动画。 不要包含多段面包屑路径。后退按钮总是执行单个操作 - 返回到上一个屏幕。

2.9K30

从navigator到react-navigation进阶教程

导航器也可以看成一个是普通的React组件,你可以通过导航器来定义你的App的导航结构。 导航器还可以渲染通用元素,例如可以配置的标题栏和选项卡栏。...navigationOptions(屏幕导航选项): 通过navigationOptions可以定制导航器显示屏幕的方式(例如:头部标题,选项卡标签等); 导航器所支持的Props const SomeNav...在导航器屏幕之外使用导航功能(巧用导航器的ref) 有一种场景:有的时候我们需要在导航器中所定义的屏幕之外使用导航器来做页面跳转。...屏幕之间的跳转是需要借助navigation来完成的; 我们知道导航器中定义的屏幕可以通过const {navigation} = this.props;来获取navigation; 那么,如果我们在非导航器中所定义的屏幕中做屏幕跳转的关键一步...ref属性获取到navigation,当上述代码的AppNavigator节点被渲染时,ref会被回调这是就可以获取到navigation了,需要提醒大家的是,这种用法对除StackNavigator之外的其他两种类型的导航器也是实用的哦

3.9K30
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    『React Navigation 3x系列教程』之React Navigation 3x开发指南

    navigationOptions(屏幕导航选项): 通过navigationOptions可以定制导航器显示屏幕的方式(例如:头部标题,选项卡标签等); 导航器所支持的Props const SomeNav...key:string or null 可选, 如果设置,具有给定 key 的导航器将重置。 如果为null,则根导航器将重置。...在导航器屏幕之外使用导航功能(巧用导航器的ref) 有一种场景:有的时候我们需要在导航器中所定义的屏幕之外使用导航器来做页面跳转。...屏幕之间的跳转是需要借助navigation来完成的; 我们知道导航器中定义的屏幕可以通过const {navigation} = this.props;来获取navigation; 那么,如果我们在非导航器中所定义的屏幕中做屏幕跳转的关键一步...ref属性获取到navigation,当上述代码的AppNavigator节点被渲染时,ref会被回调这是就可以获取到navigation了,需要提醒大家的是,这种用法对除StackNavigator之外的其他两种类型的导航器也是实用的哦

    4.3K30

    Human Interface Guidelines —— 导航栏(Navigation Bars)

    内容 当显示一个新的屏幕时,一个后退按钮(通常标有前一个屏幕的标题)出现在该bar的左侧。...在大多数情况下,标题可以帮助人们了解他们正在查看的内容。 但是,如果导航栏的标题看起来多余,则可以将标题处留空。 例如,由于第一行内容提供了所需的所有上下文,因此Notes不会为当前的笔记加标题。...通常,navigation bar不应包含除了:1、视图的当前标题;2、后退按钮;3、管理视图内容的一个控件 之外的东西。...如果您使用自定义图像替换系统提供的后退按钮V形图像,则也需要提供自定义遮罩图像。 iOS使用此遮罩在转场时为按钮标题设置动画效果。 ·不要包含多段面包屑路径。...后退按钮总是执行一个动作——返回到前一个屏幕。如果您认为没有到达当前屏幕的完整路径,人们可能会迷路,那么请考虑展开app的层次结构(如使用segmented control)。

    2.5K110

    『React Navigation 3x系列教程』之createStackNavigator开发指南

    navigationOptions(屏幕导航选项) 支持一下参数: title: 可以作为headerTitle的备选字段(当没设置headerTitle时会用该字段作为标题),也可以作为TabNavigator...header: 自定义导航条,可以通过设置null来隐藏导航条; headerTitle: 标题; headerTitleAllowFontScaling: 标题是否允许缩放,默认true; headerBackTitle...: 定义在iOS上当前页面进入到下一页面的回退标题,可以通过设置null来禁用它; headerTruncatedBackTitle: 当回退标题不能显示的时候显示此属性的标题,比如回退标题太长了; headerBackImage...headerRight: 定义导航栏右边视图; headerLeft: 定义导航栏左边视图; headerStyle: 定义导航栏的样式,比如背景色等; headerTitleStyle: 定义标题的样式...headerBackTitleStyle: 定义返回标题的样式; headerPressColorAndroid:颜色为材料波纹 (Android >= 5.0); headerTintColor: 定义导航条的

    5K10

    Android 软键盘的那些事

    在任一组设置多个值——多个”state…”values,例如&mdash有未定义的结果。各个值之间用|分开。.... > 在这设置的值(除"stateUnspecified"和"adjustUnspecified"以外)将覆盖在主题中设置的值 各值的含义: 【A】stateUnspecified:软键盘的状态并没有指定...:该Activity总是调整屏幕的大小以便留出软键盘的空间(可以显示全部屏幕) 【I】adjustPan:当前窗口的内容将自动移动以便当前焦点从不被键盘覆盖和用户能总是看到输入内容的部分(软键盘会遮挡屏幕.... > 在这设置的值(除"stateUnspecified"和"adjustUnspecified"以外)将覆盖在主题中设置的值 描述: "stateUnspecified" 这个是软件盘行为默认的设置..."stateVisible" 当用户导航到Activity主窗口时,软键盘是可见的。不过当用户离开一个Activity而导致另一个被覆盖的Activity显示出来时,软键盘会使用默认的设置。

    2K10

    Android 9.0 强势来袭,带来了哪些新特性?

    定义备份所需的设备条件 如果您的应用数据包含敏感信息或偏好设置,Android 9可让您定义应用数据包含在用户备份中的设备条件,例如启用客户端加密或本地设备到设备时转移正在进行中。...引导语义 Android 9中添加的属性使我们可以更轻松地定义辅助功能服务(尤其是屏幕阅读器)如何从屏幕的一个部分导航到另一个部分。...例如,在购物应用中,屏幕阅读器可以帮助用户直接从一种类型的交易导航到下一种交易,而屏幕阅读器不必阅读类别中的所有项目,然后再转到下一个。...通过添加这些标题,我们可以使用辅助功能服务来帮助用户直接从一个标题导航到下一个标题。任何辅助功能服务都可以使用此功能来改善用户的UI导航体验。...但是,如果我们的应用程序具有任何自定义旋转行为或使用任何不寻常的屏幕方向设置,则可能会遇到以前未被注意到的问题,此时用户轮换首选项始终设置为纵向。

    3.5K20

    Apriso开发葵花宝典之八Portal Session篇

    ,导航方式通过页面Screen中的导航类型来定义: 主页Home:堆栈中的第一个屏幕,用于重置整个屏幕堆栈历史 子门户Sub Portal:用于创建新的较低级别屏幕堆栈会话, 标准Normal:将所有相关变量放入屏幕堆栈中...设置后,不同的产品就能实例化成不同的页面实例。 下面以不同的产品为例,假设用于显示产品详细信息的屏幕名为“PRD-10”,其实例Instance设置为{ProductNo}。...如果产品ProductNo为“ABC”时,导航到此屏幕,则页面实例将设置为“PRD-10ABC”,如果产品ProductNo变为“XYZ”,则页面实例设置为“PRD-10XYZ”。...l 它必须返回一个外部输出动作 View Operation的输入输出: 外部输入: l 屏幕Screen:显示此视图的屏幕的屏幕代码 l 屏幕标题Screen Title:屏幕的标题 l 视图标题ViewTitle...n第二优先级:所有来自视图操作返回的MergeOutputs输出设置为True的其他屏幕视图的输出 Ø在动作分析期间:所有动作操作On Initialize or On Load Operation的输出

    20210

    对 WordPress 主题进行单元测试(Theme Unit Test)

    下面我们来实际的操作一下。 主题单元测试基础 导入官方 unit 测试数据 首先你需要在本地或者服务器上建立一个新的 WordPress 站点,用来进行主题的单元测试。...按照下面进行设置: 设置 => 常规:设置很长的标题和副标题等内容,看看主题如何处理。 设置 => 阅读:将显示的文章数设置为 5,这样可以测试分页功能。...设置 => 多媒体:取消固定的最大最小宽高,这样可以测试不固定尺寸图片在文章中的显示效果。 设置 => 固定链接:设置一个非默认的固定链接,检测固定链接的功能。...部件(Widgets)测试 所有的部件显示是否正常 WordPress 内置的部件在所有的显示部件的区域显示正常,并加样式合理修饰 如果主题使用自定义部件,测试自定义部件是否工作正常 在所有可以使用部件的区域测试所有部件的显示效果和功能是否正常...当自定义部件激活之后,在可以使用部件区域的默认内容应该消失被替换掉 主题屏幕截图(Screenshot)测试 屏幕截图用在后台选择主题的地方,应该准确的展示主题的设计风格 确保屏幕截图不会显示一些自定义的内容

    1.9K10

    最新iOS设计规范四|3大界面要素:视图(Views)

    警示框按钮的标题要简洁明了、合乎逻辑。最合适的按钮标题由一个或两个词语组成,用于描述选择按钮后的结果。对于所有的按钮标题,使用标题样式的文字且不需要标点符号。...浮层适合大屏幕上,可以包含各种元素,包括导航栏、工具栏、标签栏、表格、集合、图像、地图和自定义视图。当浮层出现时,其他视图的交互行为会被禁止,直到浮层被取消/关闭。...如果你调整浮层的大小,请为更改设置一些动画,以避免用户产生新浮层替换旧浮层的意识。...当滚动视图的缩放选项被打开时,设置比较合适的最大及最小值。例如:放大文本直到一个单一的字符充满整个屏幕,即使其可能对于大部分应用来说是没有意义的。 当滚动视图处于页面模式时考虑显示页面控制元素。...拆分视图提供与选项卡栏相同的快速导航,同时更好地利用了大屏幕。 为每种类型的列选择适当的样式。对于显示侧栏的主列,请使用侧栏外观。此外观适用于应用程序级导航和集合列表,例如Mail中的邮箱。

    8.5K31

    最新iOS设计规范五|3大界面要素:控件(Controls)

    一、按钮(Buttons) 按钮常用于触发特定操作,可自定义的背景颜色,并且可以包含标题或图标。系统为大多数用例提供了许多预定义的按钮样式。你也可以设计自定义按钮。...将除了冠词、并列连词和四个或更少字母的介词之外,每个单词首字母都应大写。 按钮标题尽量简短。太长的文本可能会使您的界面拥挤,并可能在较小的屏幕上被截断。 只在必要时添加边框或背景颜色。...简洁、以行动为导向的标题也使用户可以跳过他们在当前语境下不需要的子菜单。 将子菜单保持在一个层级。...不要将自定义命令与系统提供的众所周知的和经常使用的命令混在一起 尽量减少自定义命令的数量。太多的选项反而会让人陷入纠结。 自定义命令的标题尽量简短。...定期主动更新数据,保持数据的时效性。 有必要时才为刷新提供简短标题。可以为刷新控件加一个标题。但在大多数情况下,这是没有必要的,因为刷新控件的动效就很明确地表明了内容正在加载。

    8.6K30

    简单了解下无障碍设计模式

    启用焦点导航 使用焦点控制导航 屏幕阅读器 屏幕阅读器为用户提供了多种屏幕导航的方法,包括: 屏幕阅读器的触摸界面允许用户在屏幕上移动手指,以听到手指正下方的内容。这使用户能快速了解整个界面。...如果一个任务中断了,然后又恢复,请将焦点放在之前聚焦的元素上。 绿色圆圈表示屏幕中的元素接收焦点的顺序。 实施 通过使用标准的平台控件,你的应用将自动包含与平台无障碍技术协同工作所需的标记和代码。...有时,可以使用无障碍文本覆盖屏幕中的标签,来为用户提供更多信息。 可见和不可见的文本都应该是有用的描述性的词,并且都有独自的含义,因为有些用户会使用页面中的标题和链接进行导航。...开发人员注释:如果控件类型和状态没有被正确读取,则可能是控件的无障碍角色设置不正确,或者是一个自定义控件。网站上的每个元素都应该有一个相关的无障碍角色,或者通过代码为其声明一个角色。...如果图标是一个项目的属性,则将其设置为复选框,以便屏幕阅读器能读出当前状态,例如 “打开” 或 “关闭” 如果图标是一个操作,使用文本标签来指明选中图标后会发生的操作,例如 “添加到心愿单” 元素的使用方式会影响它们的显示方式

    4.8K40

    C# WPF MVVM开发框架Caliburn.Micro Screens, Conductors 和 Composition⑦

    这些屏幕中的每一个都有自定义的激活/停用逻辑,使其能够设置/拆除应用程序工具栏,以便它们根据活动屏幕提供适当的图标。在简单的场景中,ScreenActivator通常与Screen是同一个类。...此接口有一个Deactivate方法,该方法采用bool属性,指示除禁用屏幕外是否关闭屏幕。...除了标准字符串机制之外,它还提供了一个基于lambda的NotifyOfPropertyChange方法,支持强类型更改通知。此外,所有属性更改事件都会自动封送到UI线程。...之前,我们在Caliburn.Micro中讨论了屏幕和导体的理论和基本API。现在,我将介绍几个示例中的第一个。此特定示例演示如何使用导体和两个“页面”视图模型设置一个简单的导航样式shell。...CustomerViewModel能够显示本地模式对话框(它们只是特定自定义记录的模式对话框,而不是其他任何对话框)。

    2.6K20

    Android 10正式版发布,看看都有哪些新特性

    手势导航 引入手势导航后,应用程序不仅可以实现全屏幕的内容显示,还能最大限度地减少系统导航键的可见程度,这对于当下主流的全面屏手机尤为重要。...另外,团队还为包含导航抽屉(Navigation Drawer)的应用增加了一个名为 peek 的动作:用户轻压屏幕边缘然后再向内划动,便可拉出应用抽屉页面。...音频播放捕获 现在,任何播放音频的应用程序都可以让其他应用程序使用新的音频回放捕获API捕获其音频流。除了启用标题和副标题之外,该API还允许您支持流行的用例,比如实时流媒体游戏。...本地MIDI 接口 对于用c++执行音频处理的应用程序,Android 10引入了一个本地MIDI API,通过NDK与MIDI设备通信。...手势导航:在你的应用程序中支持手势导航,从边缘到边缘,并确保你的自定义手势是系统导航手势的补充。 折叠优化:通过优化可折叠设备,为当今的创新设备提供无缝体验。

    1.9K20

    iOS 图标图像 (官方翻译版)

    图像尺寸和分辨率 iOS用于将内容放置在屏幕上的坐标系基于以点为单位的测量,它们映射到显示屏中的像素。在标准分辨率屏幕上,一点等于一个像素。高分辨率屏幕具有较高的像素密度。...因为在相同量的物理空间中有更多像素,所以每点有更多像素。因此,高分辨率显示器需要具有更多像素的图像。 ? 为您的应用程序的所有设备提供高分辨率图像,适用于您的应用程序支持的所有设备。...此外,具有设置的应用程序应提供一个小图标,以显示在内置的“设置”应用程序中,支持通知的应用程序应提供一个小图标,以在通知中显示。...image.png 不要在“设置”图标上添加叠加层或边框。iOS会自动为所有图标添加1像素笔画,使其在“设置”的白色背景上看起来很好。...因为启动屏幕是静态的,任何显示的文本都不会被本地化。 低调发射。人们很可能会频繁切换应用,因此设计一个不会引起对应用程序启动体验的启发屏幕。 不要做广告 发射屏幕不是品牌的机会。

    3.6K40

    SAP S4 HANA业务伙伴工具集(BDT)

    图片SAP S4 HANA业务伙伴工具集(BDT)在几乎所有S/4 HANA项目中,都会出现这样一个问题,即BP如何与BDT一起工作。本文就这个话题给大家做一个简短的介绍,并分享一些BDT的知识。...应用程序使用BDT维护的主数据和文档数据的每个对象都被定义为应用程序对象BUP–普通业务伙伴BUB–业务伙伴关系BUA–地址CVIC–客户链接CVIV–供应商链接…应用程序可以单独打开或关闭。...它是配置(定制对象)和工作台对象(如PBO/PAI功能模块)之间的连接。视图定义字段收集在一个视图中,如果: •具有相同的上下文 •检查是相同的 视图中的字段位于子屏幕上,每个视图都分配给技术子屏幕。...另一个功能是通过单击特定的屏幕名称、视图名称、节名称……直接从BDT Analyzer导航到定制设置……字段组字段组表示具有强关系的字段的集合。请记住,字段修改基于字段组。...这意味着如果字段组设置为必填,则属于该字段组的所有字段都是必填的(类似于基于帐户组的字段修改)。功能模块CVIV_BUPA_EVENT_FMOD2_ENH负责字段状态确定(隐藏、可选、强制)。

    55930

    uni-app小程序开发常用配置项配置

    在沉浸式页面中我们要把状态栏和导航栏的位置让出来的话,使用如下方式 状态栏 uni-app提供了状态栏高度的css变量--status-bar-height,如果需要把状态栏的位置从前景部分让出来,可写一个占位...(同状态栏背景色) APP与H5为#F8F8F8,小程序平台请参考相应小程序文档 navigationBarTextStyle String black 导航栏标题颜色及状态栏前景颜色,仅支持 black...https的图片链接地址 支付宝小程序、H5、App transparentTitle String none 导航栏透明设置。...rpx 即响应式 px,一种根据屏幕宽度自适应的动态单位。 以 750 宽的屏幕为基准,750rpx 恰好为屏幕宽度。屏幕变宽,rpx 实际显示效果会等比放大。...元素选择器里没有body,改为了page 设置整个页面的样式可以使用 page { background-color: skyblue; } 图片加载 本地背景图片的引用路径推荐使用以 ~@ 开头的绝对路径

    35710

    iOS 9人机界面指南(四):UI元素(上) - 腾讯ISUX

    当用户到达一个新的层级,导航栏需要做出这样的改变: 导航栏标题应该变成当前层级的标题。 当前标题左侧放置应有返回按钮,需要的话,返回按钮可以以前一层级的标题命名。 使用当前视图的标题作为导航栏标题。...若觉得标题冗余,你也可以将标题留空。举个例子,备忘录的导航栏中就没有当前备忘录的标题,因为备忘录的第一行就已经提供了所有用户需要的内容。 ? 考虑在应用最高层级的导航栏中放置一个分段控件。...举个例子,不要在同一个应用中使用不透明导航栏和半透明工具栏。在屏幕处于同一方向时,最好不要改变不同屏上导航栏的背景图片、颜色和透明度。 确保你自定义的返回按钮的外观与操作仍然像一个返回按钮。...为每一个活动设计清晰简练的文字标题。标题将会出现在活动菜单图标的下方。一般来说短标题效果最好,因为它在屏幕上的显示效果更好并且更容易本地化。...如果合适的话,为删除按钮自定义一个名称。如果这能让用户更好地理解应用的相关功能的话,你可以创建一个合适的标题,来取代“删除”这个字样。 尽量使用简洁的文字标签,以避免被截断。

    10.1K51

    Android4.42-Settings源码分析之蓝牙模块Bluetooth(上)

    // 关于导航栏actionbar的配置,在此配置为当屏幕宽度不够时控件自动显示在屏幕底部 android:configChanges="orientation|keyboardHidden|screenSize...圈2:ActionBar底部栏,可进行蓝牙设备的搜索,检测时间,已配对设备列表等一些除了配对之外的设置,Actionbar的相关布局在onCreateOptionsMenu方法中,利用如下代码可自定义actionbar...) : 用来设置屏幕宽度不同时item的显示,actionEnum有以下几个取值。...这就涉及到了,注册广播监听本地蓝牙状态,为switch注册监听器监听switch的更改,以及对switch状态进行设置的方法。...mDiscoverable = false; //更新副标题,如果已配对设备列表为空,则为对所有设备不可见,如果已配对设备列表不为空,则为对已配对设备可见

    1.6K20

    Bootstrap实用手册

    视口的宽度:要与设备宽度一致 (2). 视口的缩放倍率:设置为 1,即不缩放 (3)....可以在一个 div 中指定在不同屏幕下的宽度占比,相同的占比可简写为一个 语法: 释义:在 xs 中 占 9...响应式导航条 当屏幕尺寸大于 768px 时候,可以正常显示出所有的内容,当屏幕尺寸小于 768px时候,一部分内容就会隐藏,通过点击弹出,响应式导航条由两部分组成. ①. class .navbar-header...将自定义的css文件后辍名改为less,在此文件开头输入:@import "../less/bootstrap.less"; 系统会生成新的css文件 (4)....自定义css文件时,所有的变量都存在variables.less文件夹里面,修改里面声明的变量值,bootstrap.less会随着更改,而自定义的less文件引入了bootstrap.less文件也会随着更改

    6K20
    领券