1

我正在用 appcelerator 构建一个应用程序。如果我的设备处于横向模式或纵向模式,我想自动调整布局。因此,经过研究,我下载了一个插件“com.jasonkneen.dynamicTSS”来实现动态 TSS。

所以这是我的代码:

<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”,我可以看到:

在此处输入图像描述

如果我在横向模式下打开我的设备,我可以看到:

在此处输入图像描述

我该如何解决我的问题?

4

0 回答 0