Lab 1

You might also like

Download as txt, pdf, or txt
Download as txt, pdf, or txt
You are on page 1of 4

Bài 1:

<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="100"/>
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="100"/>
</Grid.ColumnDefinitions>

<Label Text="Autosized cell" FontSize="Large" TextColor="White"


BackgroundColor="Blue" Grid.Row="0" Grid.Column="0"/>

<BoxView Color="Silver" Grid.Row="0" Grid.Column="1"/>

<BoxView Color="Teal" Grid.Row="1" Grid.Column="0"/>

<Label Text="Leftover space" TextColor="Blue" BackgroundColor="Aqua"


FontSize="Large"
VerticalTextAlignment="Center" HorizontalTextAlignment="Center"
Grid.Row="1" Grid.Column="1"/>

<Label Text="Span two rows (or more if you want)" TextColor="Yellow"


BackgroundColor="Blue" FontSize="Large"
VerticalTextAlignment="Center" HorizontalTextAlignment="Center"
Grid.Row="0" Grid.Column="2" Grid.RowSpan="2"/>

<Label Text="Span two columns" TextColor="Blue" BackgroundColor="Yellow"


FontSize="Large"
VerticalTextAlignment="Center" HorizontalTextAlignment="Center"
Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2"/>

<Label Text="Fixed 100x100" TextColor="Aqua" BackgroundColor="Red"


FontSize="Large"
VerticalTextAlignment="Center" HorizontalTextAlignment="Center"
Grid.Row="2" Grid.Column="2"/>

</Grid>

Bài 2:
<Grid ColumnSpacing="0" RowSpacing="0">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<BoxView Color="DarkGray" Grid.Row="0" Grid.Column="0"/>
<BoxView Color="Black" Grid.Row="0" Grid.Column="1"/>
<BoxView Color="DarkGray" Grid.Row="0" Grid.Column="2"/>
<BoxView Color="Black" Grid.Row="0" Grid.Column="3"/>

<BoxView Color="Black" Grid.Row="1" Grid.Column="0"/>


<BoxView Color="DarkGray" Grid.Row="1" Grid.Column="1"/>
<BoxView Color="Black" Grid.Row="1" Grid.Column="2"/>
<BoxView Color="DarkGray" Grid.Row="1" Grid.Column="3"/>

<BoxView Color="DarkGray" Grid.Row="2" Grid.Column="0"/>


<BoxView Color="Black" Grid.Row="2" Grid.Column="1"/>
<BoxView Color="DarkGray" Grid.Row="2" Grid.Column="2"/>
<BoxView Color="Black" Grid.Row="2" Grid.Column="3"/>

<BoxView Color="Black" Grid.Row="3" Grid.Column="0"/>


<BoxView Color="DarkGray" Grid.Row="3" Grid.Column="1"/>
<BoxView Color="Black" Grid.Row="3" Grid.Column="2"/>
<BoxView Color="DarkGray" Grid.Row="3" Grid.Column="3"/>
</Grid>
Bài 3:
<StackLayout>
<Frame BackgroundColor="#2196F3" Padding="24" CornerRadius="0">
<Label Text="Form Đăng Ký" HorizontalTextAlignment="Center"
TextColor="White" FontSize="Large"/>
</Frame>

<Entry Placeholder="Name" Keyboard="Text"


VerticalOptions="CenterAndExpand"/>

<Entry Placeholder="Email" Keyboard="Email"


VerticalOptions="CenterAndExpand"/>

<Entry Placeholder="Phone Number" Keyboard="Telephone"


VerticalOptions="CenterAndExpand"/>

<Entry Placeholder="Password" Keyboard="Text" IsPassword="True"


VerticalOptions="CenterAndExpand"/>

<Entry Placeholder="Confirm Password" Keyboard="Text" IsPassword="True"


VerticalOptions="CenterAndExpand"/>
</StackLayout>

Bài 4:
code decor:
<Grid>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>

<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>

<Label Text="Form Dang ky" TextColor="Blue" FontSize="Large"


FontAttributes="Bold"
VerticalOptions="Center" HorizontalOptions="Center"
Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"/>

<Label Text="Name:" TextColor="Black" FontSize="Large"


FontAttributes="Bold"
Grid.Row="1" Grid.Column="0" VerticalOptions="Center"/>
<Entry Placeholder="Enter your name...." Keyboard="Text" Grid.Row="1"
Grid.Column="1" VerticalOptions="CenterAndExpand" x:Name="usrName"/>

<Label Text="Email:" TextColor="Black" FontSize="Large"


FontAttributes="Bold"
Grid.Row="2" Grid.Column="0" VerticalOptions="Center"/>
<Entry Placeholder="Enter your email...." Keyboard="Email" Grid.Row="2"
Grid.Column="1" VerticalOptions="CenterAndExpand" x:Name="usrEmail"/>

<Label Text="Birthday:" TextColor="Black" FontSize="Large"


FontAttributes="Bold"
Grid.Row="3" Grid.Column="0" VerticalOptions="Center"/>
<Entry Placeholder="Enter your birthday..." Keyboard="Text" Grid.Row="3"
Grid.Column="1" VerticalOptions="CenterAndExpand" x:Name="usrDOB"/>

<Label Text="Male?" TextColor="Black" FontSize="Large"


FontAttributes="Bold"
Grid.Row="4" Grid.Column="0" VerticalOptions="Center"/>
<Switch IsToggled="False" Grid.Row="4" Grid.Column="1"
HorizontalOptions="Start" x:Name="usrGender"/>

<Button Text="SUBMIT" Grid.Row="5" Grid.Column="0" VerticalOptions="Center"


HorizontalOptions="End" x:Name="cmdSubmit" Clicked="cmdSubmit_Clicked"/>
<Button Text="CANCEL" Grid.Row="5" Grid.Column="1" VerticalOptions="Center"
HorizontalOptions="Start" x:Name="cmdCANCEL" Clicked="cmdCANCEL_Clicked"/>
</Grid>

code xu li:
private void cmdSubmit_Clicked(object sender, EventArgs e)
{
var nameValue = usrName.Text;
var emailValue = usrEmail.Text;
var DOBValue = usrDOB.Text;
var isMale = usrGender.IsToggled;

var genderValue = "";


if(isMale)
{
genderValue = "Male";
}
else
{
genderValue = "Female";
}

var message = "Name: " + nameValue + "\nEmail: " + emailValue +


"\nBirthday: " + DOBValue + "\nGender: " + genderValue;
DisplayAlert("User Information", message, "Ok");
}
private void cmdCANCEL_Clicked(object sender, EventArgs e)
{
usrName.Text = "";
usrEmail.Text = "";
usrDOB.Text = "";
usrGender.IsToggled = false;
}

You might also like