Appcelerator / Titanium - 在 iPhone X 上,如何使 ToolBar 颜色填充到屏幕底部?
Appcelerator / Titanium - On iPhone X, how to make the ToolBar colour fill to the bottom of the screen?
对于使用 Xcode 的人来说,似乎有几种解决方案,但是,我正在使用 Appcelerator Studio / Titanium,我遇到了这个问题:
在 iPhone X 上,我有一个 <Window>
和 extendSafeArea="false"
,这样工具栏就不会低于用户可以向上滑动以转到 [=29= 的区域] 主屏幕。 <Toolbar>
有绿色背景和 bottom="0"
,这使得它出现在正确的位置。不过底下有个大白space:
如何让ToolBar的绿色背景延伸到屏幕底部?
更新: 我已经尝试将 Window 背景颜色设置为与工具栏相同的颜色 - 这部分解决了问题,但是我不得不设置背景ScrollView 的颜色为白色(对于实际内容区域 above/below ToolBar)。现在的问题是,当此屏幕动画进入视图时(例如,当单击 ListView 中的项目以加载此屏幕时),它从绿色动画变为白色,因为 ScrollView 正在动画。这是一个丑陋的动画,因为它看起来闪烁绿色,然后淡入内容的正确颜色。还有其他方法吗?
我能想到几种方法来完成这个:
首先,让<Window>
有extendSafeArea="true"
,这样它一直向下延伸并覆盖用户可以向上滑动到[=68]的区域=] 主屏幕。
然后,在底部放置一个绿色视图,填充下方区域。
最后,通过调整其位置或边距,将绿色 ToolBar
放置在与现在相同的位置。
布局应该像现在这样显示 ToolBar
,但在它下面有一个绿色视图,因为 window 允许它填充 space。
首先用 0 alpha 值隐藏 ToolBar
,这样一开始它就不会显示了,因为屏幕会动画显示。
经过一小段延迟后,现在显示视图时:
- 将
Window
背景颜色从白色淡化为与 ToolBar
相同的绿色。
- 通过将其 alpha 值设置为从 0 到 1 的动画来淡化
ToolBar
。
这应该会产生比您之前的尝试更不丑陋的动画。
与上面的第 2 点类似,隐藏 ToolBar
,但这次,将其移出屏幕,在可见区域下方。
将 window 保留为白色,稍等片刻后,当视图可见时:
- 淡化或直接将
Window
背景颜色从白色设置为与 ToolBar
相同的绿色。
- 将
ToolBar
的位置从界面下方移动到当前位置。您可以尝试使用反弹或其他效果,看看结果是否更令人满意。同样,您可以探索将 ToolBar
关闭屏幕隐藏到左侧,然后设置动画以使其从那里进入界面。
想法 2 和 3 的共同概念是在 ToolBar
上使用显示动画,以便 "explain" 设置 Window
背景的界面发生变化颜色.
对于使用 Xcode 的人来说,似乎有几种解决方案,但是,我正在使用 Appcelerator Studio / Titanium,我遇到了这个问题:
在 iPhone X 上,我有一个 <Window>
和 extendSafeArea="false"
,这样工具栏就不会低于用户可以向上滑动以转到 [=29= 的区域] 主屏幕。 <Toolbar>
有绿色背景和 bottom="0"
,这使得它出现在正确的位置。不过底下有个大白space:
如何让ToolBar的绿色背景延伸到屏幕底部?
更新: 我已经尝试将 Window 背景颜色设置为与工具栏相同的颜色 - 这部分解决了问题,但是我不得不设置背景ScrollView 的颜色为白色(对于实际内容区域 above/below ToolBar)。现在的问题是,当此屏幕动画进入视图时(例如,当单击 ListView 中的项目以加载此屏幕时),它从绿色动画变为白色,因为 ScrollView 正在动画。这是一个丑陋的动画,因为它看起来闪烁绿色,然后淡入内容的正确颜色。还有其他方法吗?
我能想到几种方法来完成这个:
首先,让
<Window>
有extendSafeArea="true"
,这样它一直向下延伸并覆盖用户可以向上滑动到[=68]的区域=] 主屏幕。然后,在底部放置一个绿色视图,填充下方区域。
最后,通过调整其位置或边距,将绿色
ToolBar
放置在与现在相同的位置。布局应该像现在这样显示
ToolBar
,但在它下面有一个绿色视图,因为 window 允许它填充 space。首先用 0 alpha 值隐藏
ToolBar
,这样一开始它就不会显示了,因为屏幕会动画显示。经过一小段延迟后,现在显示视图时:
- 将
Window
背景颜色从白色淡化为与ToolBar
相同的绿色。 - 通过将其 alpha 值设置为从 0 到 1 的动画来淡化
ToolBar
。
这应该会产生比您之前的尝试更不丑陋的动画。
- 将
与上面的第 2 点类似,隐藏
ToolBar
,但这次,将其移出屏幕,在可见区域下方。将 window 保留为白色,稍等片刻后,当视图可见时:
- 淡化或直接将
Window
背景颜色从白色设置为与ToolBar
相同的绿色。 - 将
ToolBar
的位置从界面下方移动到当前位置。您可以尝试使用反弹或其他效果,看看结果是否更令人满意。同样,您可以探索将ToolBar
关闭屏幕隐藏到左侧,然后设置动画以使其从那里进入界面。
- 淡化或直接将
想法 2 和 3 的共同概念是在 ToolBar
上使用显示动画,以便 "explain" 设置 Window
背景的界面发生变化颜色.