Linear Layout

LinearLayout is a linear box layout in which the children of a layout are arranged vertically or horizontally by using LinearOrientation property.

HorizontalAlignment defines where you can start positioning children from beginning to end. It can be used when children do not use all the horizontal space of a parent.

VerticalAlignment defines where you can start positioning children from top to bottom. It can be used when children do not use all the vertical space of a parent.

While positioning children in a linear form that is one after the other, you can use CellPadding to insert a space between each child. Unlike generic padding, CellPadding does not insert a space at the start, end, top, or bottom of the layout.

Here are the properties of LinearLayout:

Orientation

LinearOrientation indicates the direction of a child’s layout such as horizontal or vertical. The default value is horizontal.

Horizontal	Vertical

                
C#
                

                    
Copy
                    

                
            
View layoutView = new View();
var linearLayout = new LinearLayout();
linearLayout.LinearOrientation = LinearLayout.Orientation.Horizontal;
layoutView.Layout = layout;

                
xml
                

                    
Copy
                    

                
            
<View>
    <View.Layout>
        <LinearLayout LinearOrientation="Horizontal"/>
    </View.Layout>
</View>

Alignment

HorizontalAlignment handles how the layout items are positioned horizontally within their parent layout. By default, items are aligned at Begin. You can choose from the following horizontal alignment options:

The following example shows how to set the layout horizontal alignment to Center:

                
C#
                

                    
Copy
                    

                
            
View layoutView = new View();
var linearLayout = new LinearLayout();
linearLayout.HorizontalAlignment = HorizontalAlignment.Center;
layoutView.Layout = layout;

                
xml
                

                    
Copy
                    

                
            
<View>
    <View.Layout>
        <LinearLayout HorizontalAlignment="Center"/>
    </View.Layout>
</View>

VerticalAlignment handles how the layout items are positioned vertically within their parent layout. By default, items are aligned at Top. You can choose from the following vertical alignment options:

The following example shows how to set the layout vertical alignment to Center:

                
C#
                

                    
Copy
                    

                
            
View layoutView = new View();
var linearLayout = new LinearLayout();
linearLayout.VerticalAlignment = VerticalAlignment.Center;
layoutView.Layout = layout;

                
xml
                

                    
Copy
                    

                
            
<View>
    <View.Layout>
        <LinearLayout VerticalAlignment="Center"/>
    </View.Layout>
</View>

CellPadding

CellPadding is to set the padding between cells in the layout. It is used to insert a space between each child. The type of CellPadding is Size2D, which is two-dimensional. Height and width values are considered in CellPadding. After setting CellPadding to parent view, the interval between children is located by the width of CellPadding in the case of horizontal layout or by the height of CellPadding in the case of vertical layout.

The type of CellPadding is not Extents which has start, end, top, and bottom, but Size2D which has float width and float height. In the following image, the arrow is the width (10) because the orientation of the container layout is horizontal.

                
C#
                

                    
Copy
                    

                
            
View layoutView = new View();
var linearLayout = new LinearLayout();
linearLayout.CellPadding = new Size2D(10, 20);
layoutView.Layout = layout;

                
xml
                

                    
Copy
                    

                
            
<View>
    <View.Layout>
        <LinearLayout CellPadding="10,20">
    </View.Layout>
</View>

Weight

Weight is used to determine how much space is occupied by a view and how a view shares the available space in a layout with its siblings.

Depending on each weight, children take up their parent’s view space. Therefore, child views can set the Weight value to float type. The default weight value is zero. If the weight is zero, then the size of the child would be its natural size or the specific size the user sets.

The following example shows how to set the layout weight for each child. The weight of imageView1 is 0.75f and the weight of imageView2 is 0.25f. According to the weight, children are arranged in the parent view space.

                
C#
                

                    
Copy
                    

                
            
View layoutView = new View();
var linearLayout = new LinearLayout();
layoutView.Layout = linearLayout;

ImageView imageView1 = new ImageView();
imageView1.Weight = 0.75f;

ImageView imageView2 = new ImageView();
imageView2.Weight = 0.25f;

layoutView.Add(imageView1);
layoutView.Add(imageView2);

                
xml
                

                    
Copy
                    

                
            
<View>
    <View.Layout>
        <LinearLayout />
    </View.Layout>

    <ImageView Weight="0.75"/>
    <ImageView Weight="0.25"/>
</View>

Related information

• Dependencies
  • Tizen 5.5 and Higher