I have a button that has an image and a text below the image, I want to reduce the space between the two on android, on iOS there is no spaces in between, here is what I have done:
<Grid x:Name="MainGrid">
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button x:Name="btnApplyLeave" ContentLayout="Top,0" BackgroundColor="White" FontSize="10" TextColor="#777777"" ImageSource="applyleave.png" BorderWidth="1" BorderColor ="#ededed" Text="Apply Leave" Grid.Row="0" Grid.Column="0" VerticalOptions="Center" HorizontalOptions="Fill" HeightRequest="{Binding Width, Source={x:Reference btnApplyLeave}}" >
<Button.CornerRadius>
<OnPlatform Android="6">
</OnPlatform>
</Button.CornerRadius>
</Button>
<Button x:Name="captureIntent" ContentLayout="Top,0" ImageSource="capturescores.png" Text="Capture Scores" TextColor="#777777 FontSize="10" BorderWidth="1" BorderColor ="#ededed" BackgroundColor="White" Grid.Row="0" Grid.Column="1" VerticalOptions="Center" HorizontalOptions="Fill" HeightRequest="{Binding Width, Source={x:Reference captureIntent}}" >
<Button.CornerRadius>
<OnPlatform Android="6">
</OnPlatform>
</Button.CornerRadius>
</Button>
</Grid>
I'm not sure about how to do it with a single button, but you could make a frame with a TapGestureRecognizer that will act like a button. The TapGestureRecognizer have both Tapped (like clicked on button) and Command for MVVM. The code needs some adjustment in your project, but you get the idea:
<Frame HeightRequest="{Binding yourHeight}" CornerRadius="6" HasShadow="false"
BackgroundColor="White" BorderColor="#ededed" HorizontalOptions="Fill">
<Frame.GestureRecognizers>
<TapGestureRecognizer />
</Frame.GestureRecognizers>
<Image Source="image.png" HorizontalOptions="Center" VerticalOptions="Center"/>
<Label Text="TestText" HorizontalOptions="Center" VerticalOptions="Center"/>
</Frame>
I found this issue is realted to the ContentLayout
in the android platform.
If I set the value of spacing
to -200
in the android Platform We can reduce the spacing.
if (Device.RuntimePlatform == Device.Android)
{
btnApplyLeave.ContentLayout = new Button.ButtonContentLayout(Button.ButtonContentLayout.ImagePosition.Top, -200);
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.