微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

android-Xamarin按钮边框问题

我正在尝试使用Xamarin.forms制作一个应用程序.问题是在Android版本中,显示了按钮边框,我想删除它们.我尝试了BorderColor =“ Transparent”,但是没有用.

Border button on Android

另外,我在使用文本时遇到了一些问题.实际上,我希望在图标和文本之间有一些填充(例如在F和Facebook之间).有没有办法做到这一点 ?以及如何处理有关iPhone 5和“ Fa … ook”上的文本大小的问题?我试图派一个较小的警察,但我猜有最好的解决方案吗?

Police on iPhone 5

这是我的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>

解决方法:

对于同时包含文本和图像的按钮,我总是发现最简单的方法是只使用带有图像和标签的堆栈布局,然后向其添加轻击手势.这样,您就可以更好地控制图像以及文本的位置和缩放比例(并且可以解决边框问题).所以像这样:

XAML:

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

XAML文件

  ...
  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
}

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐