Appcelerator钛导航窗口

Question

你好钛金属手机开发者，

我对navigationWindow有一些疑问，因为图片胜过数千个单词：

正如你所看到的，我有一个navigationWindow的蓝色后退按钮和一个带有图像的ScrollableView内容：

<Alloy>
<Window>
    <ScrollableView id="scrollableView" showPagingControl="true" overlayEnabled="true" pagingControlColor="transparent" backgroundColor="black">
        <View id="view1">
            <ImageView class="fullBgImage"image="images/pubs/v2.png" />
        </View>
        <View id="view2">
            <ImageView id="imageview_1" image="images/pubs/pub_un.jpg" />
        </View>
        <View id="view3">
            <ImageView id="imageview_2" image="images/pubs/pub_deux.jpg" />
        </View>
        <View id="view4">
            <ImageView image="images/pubs/guide.png" />
        </View>
        <View id="view5" >
            <ImageView touchEnabled="false" image="images/pubs/start.png" />
        </View>
    </ScrollableView>
</Window>

我的问题是我无法将后退按钮文本和箭头变为白色，并且我在ScrollableView的两侧都有填充。

我怎样才能摆脱那些填充物？和颜色后退按钮？

以下问题已解决

我还有另外一个问题，是否可以全屏显示图像视图，我的意思是将后退按钮放在视图下方，请参阅下面的截图：

感谢您的帮助。

Answer 1

对于后退按钮标题颜色，

在包含该窗口的NavigationWindow上使用 tintColor property ：

    <NavigationWindow platform="ios" tintColor="white">
        <Window    </Window>
    </NavigationWindow>

对于ScrollableView填充，我认为这是由于图像宽高比，图像的原始宽度是您正在查看的那个。

您可以通过向包含图像的视图（id =“view1”或view2或view3 ...）提供一些backgroundColor来检查它。

因此，要使用图像填充整个屏幕宽度，您可以尝试2个选项：

1. 为图像使用不同的宽高比（可能无法在所有设备上使用）。

2. 提供图片 width ='100％'和height ='100％'，而不是 Ti.UI.FILL 或 Ti.UI。 SIZE

这是你如何做到的。

<View id="view1">
    <ImageView class="fullBgImage" width='100%' height='100%' image="images/pubs/v2.png" />
</View>

或

<View id="view1">
    <ImageView id='images' image="images/pubs/v2.png" />
</View>

$.images.height = Titanium.Platform.displayCaps.platformHeight;
$.images.width = Titanium.Platform.displayCaps.platformWidth;

简单地说，不要自动设置宽度或高度。自己设置。

对于imageview后面的后退按钮，你可以这样做：

<强> .XML

<Window class="full-window">
   <View class='header'>
       <Button left="15" title="<  Back" color="white"></Button>
   </View>

   <View zIndex="1">
       <ScrollableView id="scrollableView" showPagingControl="true" overlayEnabled="true" pagingControlColor="transparent" backgroundColor="black">
           ....
        </ScrollableView>
   </View>
</Window>

<强> .tss

".full-window": {
    fullscreen: true, // set to false if you want to show battery-signal status bar
    navBarHidden: true  // must be true to show manual view
}

".header": {
    top : 0,
    height: '64dp',
    backgroundColor: "#3000",
    zIndex : 2    // necessary to put your content view behind it
}

Answer 2

要使其全屏显示，您只需要设置两个布尔属性navBarHidden和fullscreen到true，请查看以下代码：

<Window navBarHidden = "true" fullscreen="true">
  // Your other Views
</Window>

祝你好运，干杯