私は appcelerator でアプリを構築しています。デバイスが横向きモードまたは縦向きモードの場合、レイアウトを自動調整したいと考えています。そのため、調査の後、動的TSSを実装するためにプラグイン「com.jasonkneen.dynamicTSS」をダウンロードしました。
これは私のコードです:
<View class="container">
<View id="logoImage" class="images"></View>
<Widget src="com.jasonkneen.dynamicTSS"/>
<Label id="loginLable"
class="loginLable">Accedi</Label>
<View id="viewText" class="viewTextLogin">
<TextField id="username" class="textLogin" hintText="Insert username"></TextField>
<Widget src="com.jasonkneen.dynamicTSS"/>
<TextField id="password" class="textLogin" hintText="Insert password"
passwordMask="true"></TextField>
<Widget src="com.jasonkneen.dynamicTSS"/>
</View>
</View>
これは私の login.tss ファイルです
".images":{
top:"5px",
backgroundImage : "/images/logo.png",
landscape: {
width : "60%",
height: "55px"
},
portrait: {
width : "90%",
height: "62px"
}
}
".textLogin":{
top : 20,
backgroundColor : "#c9c9c9",
borderRadius : 10,
borderWidth : 1,
borderColor : "#fff",
color : "#fff",
font : {
fontFamily : 'Roboto-Regular',
fontSize : "14pt",
fontWeight : "Regular"
},
paddingLeft : 10,
landscape: {
height : "30%",
width: '10%',
},
portrait: {
height : "12%",
width: '90%',
}
}
".viewTextLogin":{
height:Ti.UI.Fill,
landscape: {
layout:"horizontal"
},
portrait: {
layout:"vertical"
}
}
デバイスの向きを変更しようとすると、オブジェクト「logoImage」が正しく表示されるようになりました。しかし、デバイスが縦向きモードの場合、ビュー「viewText」を見ると、次のことがわかります。
デバイスを横向きモードにすると、次のことがわかります。
どうすれば問題を解決できますか?