如何從 Xamarin Forms XAML 中的按鈕中刪除邊距？

Question

我是 Xamarin 的新手，所以請耐心等待！ 不知何故，Xamarin 為我所有的按鈕添加了一個神秘的邊距，我不知道如何擺脫它。

這是我的代碼：

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="RockStamp.CameraSearch_Scan">

    <StackLayout Orientation="Vertical" Padding="0" Spacing="0">
      <StackLayout Orientation="Horizontal" Padding="0" Spacing="0">
      <Button  Text="Test" HeightRequest="50" WidthRequest="60" TextColor="#333333" x:Name="btnBack" VerticalOptions="Center" HorizontalOptions="Start" ></Button>
      <Label Text="Scan a..." FontSize="20" FontAttributes="Bold" BackgroundColor="{StaticResource BlueBackColor}" TextColor="White"  VerticalOptions="Start" HorizontalOptions="FillAndExpand" />
    </StackLayout>

    <Label Text="Steady now, we try to detect your..." FontSize="16"  VerticalOptions="Start" HorizontalOptions="Start" />

    <!-- Camera Placeholder -->
    <BoxView  HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="#eeeeee" ></BoxView>

    <StackLayout Orientation="Horizontal" Padding="0" Spacing="0">
      <Button Text="Cancel" TextColor="#333333" x:Name="btnCancel"  VerticalOptions="Center" HorizontalOptions="FillAndExpand" ></Button>
      <Button Text="Scan now!" TextColor="#333333" x:Name="btnScan"  VerticalOptions="Center" HorizontalOptions="FillAndExpand" ></Button>
    </StackLayout>

  </StackLayout >

</ContentPage>

這里有一個圖像：

您可以清楚地看到按鈕周圍的空間。 它來自哪里 - 更重要的是：我該如何刪除它？

Answer 1

問題是默認按鈕背景包含此邊距。 您必須將BackgroundColor設置為一種顏色，並將BorderWidth和BorderRadius手動設置為零。

<Button
    BackgroundColor="Fuchsia"
    BorderRadius="0"
    BorderWidth="0"
    Text="Test"
    HeightRequest="50"
    WidthRequest="60"
    TextColor="#333333"
    x:Name="btnBack"
    Margin="0"
    VerticalOptions="Start"
    HorizontalOptions="Start" />

Answer 2

您可能已經解決了問題：

我解決這個問題的方法是在 android 上創建一個渲染器來覆蓋 xamarin 上的按鈕。

public class FixedMarginRenderer : ButtonRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<Button> e)
    {
        base.OnElementChanged(e);

        if (Control != null)
        {
            // remove default background image
            Control.Background = null;
            Control.SetBackgroundColor(Element.BackgroundColor.ToAndroid()); 
        }
    }

    protected override void OnElementPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
    {
        base.OnElementPropertyChanged(sender, e);

        if (e.PropertyName == "BackgroundColor")
        {
            // You have to set background color here again, because the background color can be changed later.
            Control.SetBackgroundColor(Element.BackgroundColor.ToAndroid());
        }
    }
} 

Answer 3

只是為了補充 Sven-Michael Stübe 的回答。

如果您的按鈕都不需要 Margin，則在您的 PCL 中創建一個樣式或自定義控件（例如：MarginLessButton）。

Answer 4

手動設置BackgroundColor 、 BorderWidth和BorderRadius不再起作用。 但是您可以使用平台配置來刪除填充。 還需要去除陰影，否則會有一些垂直邊距。

嘗試這樣的事情：

using Xamarin.Forms;
using Xamarin.Forms.PlatformConfiguration;
using Xamarin.Forms.PlatformConfiguration.AndroidSpecific;

namespace MyControls
{
    public class ButtonNoMargin : Xamarin.Forms.Button
    {
        public ButtonNoMargin() : base()
        {
           this.On<Android>().SetUseDefaultPadding(false);
           this.On<Android>().SetUseDefaultShadow(false);
        }
    }
}

有關詳細信息，請參閱https://github.com/xamarin/Xamarin.Forms/pull/1935