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 
}