🟪 XAMARIN FORMS Aula 28 - Interface de cadastro de contatos

Na aula de Xamarin Forms de hoje (a número 28), vamos fazer uma interface de cadastro de contatos no XAML do Xamarin Forms. Essa interface de cadastro de contatos, irá se conectar ao banco de dados Firebase (Real time database).

Não deixe de acompanhar as aulas anteriores para fazer seu app completo em Xamarin Forms, usando Visual Studio (C# e XAML).

Código utilizado:

<ContentPage Title="Cadastrar">

        <ScrollView>

        <Grid>

            <StackLayout VerticalOptions="Start" Padding="30">

                <Label Text="Cadastrar"

                       FontSize="Title" TextColor="Black"

                VerticalOptions="CenterAndExpand" 

                HorizontalOptions="CenterAndExpand" />

                <Frame BorderColor="Black" CornerRadius="10"

                       Margin="0,20">

                    <Grid>

                        <Grid.ColumnDefinitions>

                            <ColumnDefinition Width="Auto"/>

                            <ColumnDefinition/>

                            <ColumnDefinition />

                            <ColumnDefinition />

                        </Grid.ColumnDefinitions>

                        <Grid.RowDefinitions>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                            <RowDefinition Height="auto"/>

                        </Grid.RowDefinitions>

                        <Label Grid.Row="0" Grid.Column="0" 

                            Text="Nome: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTNome" Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="3"/>

                        <Label Grid.Row="1" Grid.Column="0" 

                            Text="Telefone 1 " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTTel1" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="3"/>

                        <Label Grid.Row="2" Grid.Column="0" 

                            Text="Telefone 2 " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTTel2" Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="3"/>

                        <Label Grid.Row="3" Grid.Column="0" 

                            Text="E-mail: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTEmail" Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="3"/>

                        <Label Grid.Row="4" Grid.Column="0" Grid.ColumnSpan="4"

                            Text="Endereço " TextColor="Black" FontAttributes="Italic"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Label Grid.Row="5" Grid.Column="0" 

                            Text="CEP: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTCep" Grid.Row="5" Grid.Column="1" Grid.ColumnSpan="2"

                               Unfocused="TXTCep_Unfocused"/>

                        

                        <Label Grid.Row="6" Grid.Column="0" 

                            Text="Logradouro: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTLogradouro" Grid.Row="6" Grid.Column="1" Grid.ColumnSpan="3"/>

                        <Label Grid.Row="7" Grid.Column="0" 

                            Text="Nº: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTNumero" Grid.Row="7" Grid.Column="1" />

                        <Label Grid.Row="7" Grid.Column="2" 

                            Text="Compl.: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTComplemento" Grid.Row="7" Grid.Column="3" />

                        <Label Grid.Row="8" Grid.Column="0" 

                            Text="Bairro: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTBairro" Grid.Row="8" Grid.Column="1" Grid.ColumnSpan="3"/>

                        

                        <Label Grid.Row="9" Grid.Column="0" 

                            Text="Cidade: " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTCidade" Grid.Row="9" Grid.Column="1" Grid.ColumnSpan="3"/>

                        <Label Grid.Row="10" Grid.Column="0" 

                            Text="UF " TextColor="Black" FontAttributes="Bold"

                               HorizontalOptions="Start" VerticalOptions="Center" />

                        <Entry x:Name="TXTUF" Grid.Row="10" Grid.Column="1" />

                    </Grid>

                </Frame>

                <Button x:Name="BTNSalvar" Text="Salvar"

                        BackgroundColor="Black" TextColor="White"

                        HorizontalOptions="CenterAndExpand" CornerRadius="20"

                        Clicked="BTNSalvar_Clicked"

                        />

                <Button x:Name="BTNLimpar" Text="Limpar"

                        BackgroundColor="Transparent" TextColor="Red"

                        HorizontalOptions="CenterAndExpand" CornerRadius="20"

                        Clicked="BTNLimpar_Clicked"

                        />

            </StackLayout>

        </Grid>

        </ScrollView>

    </ContentPage>

Abraços e até a próxima!

Seja meu patrão: https://www.patreon.com/newbieaulas/

Para encontrar mais aulas como esta, ou outras diferentes, acesse nosso índice clicando aqui!