weblion weblion - 21 days ago 7
Javascript Question

What's the resolution / image sizes to use for barImage on Ti.UI.Window?

basically, I want to do something like Instagram

enter image description here

(http://avocadosocial.com/wp-content/uploads/2016/08/IMG_3921.jpg) related to the

barImage
of the starting window. My logo, which I want to put there, is also more or less in this dimensions (around 16:9). I'm not able to find the correct resolutions/dimension information (ideal
height
and
width
) to use for the
barImage
property.

Can someone help?

Answer

First of all, I think that there is not barImage used in the link you provided and still you can achieve the perfect result by following these steps:

For Window title, you can customise it like this:

"Window[platform=ios]": {
    backgroundColor : 'white',
    navTintColor : 'white',
    barColor : Alloy.CFG.COLOR_PRIMARY,
    titleAttributes : {
        color : 'white',
        font : { fontFamily : 'font', fontSize : 18 },   // see how to use custom fonts in Appc Docs
    },
    swipeToClose : false
}
  • titleAttributes is what applied to the title of window in navigation stack.

  • For left/right nav buttons, I prefer to use this type of code:

Do not use ImageView in buttons, use Button and set the title of it using fontAwesome or Material Icons font file.

<RightNavButton>
                    <View>
                        <Button class="materialFont" title="\ue5cd" onClick="close" />
                    </View>
                </RightNavButton>

Do remember to use the Button inside View, otherwise your font won't applied to button and you will see some weird image.

Comments