StackLayout布局

来源:互联网 发布:研究院与研究生院 知乎 编辑:程序博客网 时间:2024/06/04 19:26


StackLayout布局要求子元素从上到下或者从左到右依次排列


既可以竖也可以横,取决于StackLayout的orientation属性。默认是 orientation:LayoutOrientation::TopToBottom


子元素可以使用 HorizontalAlignment 和VerticalAlignment属性 可以指定元素在父容器在横着的还是竖着的位置


如果是RightToLeft排版,则子元素水平布局起作用
import bb.cascades 1.0


Page {
    Container {
        layout: StackLayout {
            orientation: LayoutOrientation.RightToLeft
        }
        Button {
            text: "Button1"
            horizontalAlignment: HorizontalAlignment.Left // 从左到右或从右到左排版,水平对齐无效
            verticalAlignment: VerticalAlignment.Fill // 1,从左到右,或从右到左排版,垂直对齐有效; 2,VerticalAlignment.Fill在测试版本暂时不起作用
        }
        Button {
            text: "Button2"
            verticalAlignment: VerticalAlignment.Center
        }
    }
}




如果是TopTopBottom排版,则子元素HorizontalAlignment起作用:
import bb.cascades 1.0


Page {
    Container {
        layout: StackLayout {
            orientation: LayoutOrientation.TopToBottom
        }
        // horizontalAlignment: HorizontalAlignment.Left // 这个属性是管自己元素(Container)而不是子元素们的
        Button {
            text: "Button1"
            horizontalAlignment: HorizontalAlignment.Fill // 1,horizontalAlignment的Fill值起作用; 2,从上到下排版,水平对齐有效
        }
        Button {
            text: "Button2"
            horizontalAlignment: HorizontalAlignment.Right


        }
    }
}