Xamarin按鈕邊框問題

Question

我在嘗試使用Xamarin.forms創建應用程序。問題是，在Android版本中，顯示按鈕邊框，我想刪除它們。我試過BorderColor="Transparent"，但沒有奏效。

另外，我有些問題文本。事實上，我想在圖標和文本之間有一些填充（例如在F和Facebook之間）。有沒有辦法做到這一點 ？我該如何處理有關iPhone 5和「Fa ... ook」文本大小的問題？我試圖把一個更小的警察，但我想有一個最好的解決方案？

這裏是我的XAML代碼：

<Grid Margin="0,20,0,0"> 
    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="*"/> 
     <ColumnDefinition Width="*"/> 
    </Grid.ColumnDefinitions> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="100"/> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="*"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 

    <Label Text="Waka'Lokos" Margin="0,20,0,0" HorizontalOptions="Center" FontSize="22.5" TextColor="White" Grid.Row="0" Grid.Column="1"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="fb" Text="Facebook" Grid.Row="1" Grid.Column="0" Image="fb.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="contact" Text="Contact" Grid.Row="1" Grid.Column="1" Image="call.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="insta" Text="Insta" Grid.Row="1" Grid.Column="2" Image="insta.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="chants" Text="Chants" Grid.Row="2" Grid.Column="0" Image="micro.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="communaute" Text="Team" Grid.Row="2" Grid.Column="1" Image="team.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="youtube" Text="Youtube" Grid.Row="2" Grid.Column="2" Image="yt.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="partenaires" Text="Partner" Grid.Row="3" Grid.Column="0" Image="partner.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="plans" Text="Bons Plans" Grid.Row="3" Grid.Column="1" Image="money.png" TextColor="#FEF4CA"/> 
    <Button BackgroundColor="Transparent" FontSize="10" ContentLayout="Top" HorizontalOptions="Center" VerticalOptions="Center" x:Name="agenda" Text="Agenda" Grid.Row="3" Grid.Column="2" Image="agenda.png" TextColor="#FEF4CA"/> 
</Grid> 

Answer 1

對於同時包含文本和圖像按鈕，我總是發現它最簡單的只使用一個stacklayout用圖像和標籤然後爲其添加輕擊手勢。這樣，您就可以更好地控制圖像的定位和縮放以及文本（並且可以處理邊框問題）。因此，像：

XAML：

<StackLayout x:Name="buttonStack" WidthRequest="50"> 
    <Image Source="fb.png" Aspect="AspectFit" HorizontalOptions="CenterAndExpand"/> 
    <Label Text="Facebook" HorizontalOptions="CenterAndExpand" HorizontalTextAlignment="Center"/> 
</StackLayout> 

XAML.CS

... 
    TapGestureRecognizer tap = new TapGestureRecognizer(); 
    tap.Tapped += HandleClickEvent; 

    buttonStack.GestureRecognizers.Add(tap); 
} 

private void HandleClickEvent(object sender, EventArgs e) 
{ 
    //some code here 
} 

如果要僞造一個按鈕，水龍頭動畫可以代替試試這個。你可以調整250毫秒到別的東西來獲得正確的感覺：

private async void HandleClickEvent(object sender, EventArgs e) 
{ 
    await buttonStack.FadeTo(0,250); 
    buttonStack.FadeTo(1,250); 
    //some code here 
}