How to enlarge the active Entry field ( Xamarin) - xamarin

Question

How to enlarge the active Entry field. Active - a place that will trigger the activation of this place after pressing

Answer 1

You can use the Scale method to increase the size of the Entry.Every view has the property Scale which can be used to increase the size;
entry.Scale =2;

Answer 2

Have a look at the new Visual State Manager for Xamarin Forms 3.0
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/visual-state-manager
It allows you to style your entry for different states. The common states are Normal, Focused, Disabled.
You can e.g. increase the FontSize and do stuff with other states as well. (have a look at the given link)
Your desired state is Focused.
<Entry FontSize="18">
<VisualStateManager.VisualStateGroups>
<VisualStateGroup x:Name="CommonStates">
<VisualState x:Name="Normal">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="Lime" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Focused">
<VisualState.Setters>
<Setter Property="FontSize" Value="36" />
</VisualState.Setters>
</VisualState>
<VisualState x:Name="Disabled">
<VisualState.Setters>
<Setter Property="BackgroundColor" Value="Pink" />
</VisualState.Setters>
</VisualState>
</VisualStateGroup>
</VisualStateManager.VisualStateGroups>
</Entry>

Answer 3

There are lots of ways to achieve that.
One of them is changing positional properties, like Margin:
<ContentPage.Resources>
<ResourceDictionary>
<Style TargetType="Entry">
<Style.Setters>
<Setter Property="Margin" Value="20,30,30,30"/>
<Setter Property="HorizontalOptions" Value="FillAndExpand"/>
<Setter Property="VerticalOptions" Value="Center"/>
<Setter Property="BackgroundColor" Value="AliceBlue"/>
</Style.Setters>
</Style>
<Style TargetType="Image">
<Style.Setters>
<Setter Property="HorizontalOptions" Value="Center"/>
<Setter Property="VerticalOptions" Value="Center"/>
<Setter Property="Margin" Value="10"/>
<Setter Property="Source" Value="icon"/>
</Style.Setters>
</Style>
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout>
<Grid BackgroundColor="Silver">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Image Grid.Column="0" Grid.Row="0"/>
<Entry Grid.Column="1" Grid.Row="0"
x:Name="txtName"
Placeholder="Name"
Focused="GrowEntry"
Unfocused="ShrinkEntry"/>
<Image Grid.Column="0" Grid.Row="1"/>
<Entry Grid.Column="1" Grid.Row="1"
x:Name="txtEmail"
Placeholder="E-mail"
BackgroundColor="AliceBlue"
Focused="GrowEntry"
Unfocused="ShrinkEntry"/>
<Image Grid.Column="0" Grid.Row="2"/>
<Entry Grid.Column="1" Grid.Row="2"
x:Name="txtPassword"
Placeholder="Password"
Focused="GrowEntry"
Unfocused="ShrinkEntry"/>
</Grid>
<BoxView Color="White"
VerticalOptions="FillAndExpand"/>
</StackLayout>
And in the code behind, the GrowEntry and ShrinkEntry:
private void GrowEntry(object sender, EventArgs args)
{
var entry = (Entry)sender;
entry.Margin = new Thickness(6, 12, 12, 12);
}
private void ShrinkEntry(object sender, EventArgs args)
{
var entry = (Entry)sender;
entry.Margin = new Thickness(20, 30, 30, 30);
}
You'll get something like that: