时间戳

首页 > 解决方案 > 如何更改点击的 MaterialCard 的不透明度？

xaml - 如何更改点击的 MaterialCard 的不透明度？

问题描述

在我的 HomePage.xaml 中有材料：MaterialCard。

<material:MaterialCard Grid.Column="0"
                       BackgroundColor="{StaticResource CustomizedRedColor}"
                       WidthRequest="70"
                       HeightRequest="70"
                       VerticalOptions="Center"
                       CornerRadius="4"
                       Elevation="1"
                       Padding="5"
                       x:Name="CreateMQRCard"
                       Opacity="{Binding Opacity}"
                       Clicked="MaterialCard_Clicked">
                <material:MaterialCard.GestureRecognizers>
                    <TapGestureRecognizer Command="{Binding CreateMQRCommand}" />
                </material:MaterialCard.GestureRecognizers>

                <Image Source="create_new_mqr.png"
                       Aspect="Fill"
                       HeightRequest="55"
                       WidthRequest="55"
                       HorizontalOptions="CenterAndExpand"
                       VerticalOptions="CenterAndExpand" />
            </material:MaterialCard>

所以我将 Opacity 绑定到 HomeViewModel.cs 中的属性：

public double Opacity { get; set; } = 1;

然后，在CreateMQR方法中，我试图在导航到另一个页面之前更改不透明度。

private async void CreateMQR()
        {                        
            Opacity = 0.5;
            await Task.Delay(700);
            Opacity = 1;
            ShowDialog();
            await App.Current.MainPage.Navigation.PushAsync(new CreateMQRPage());
            HideDialog();
        }

导航工作正常，命令调用方法没有问题，不透明度设置为值，但在屏幕上没有任何反应。将不透明度设置为 0.5 然后回到 1，我想在点击时创建“闪烁”效果。（类似于按钮）

标签： xamlmvvmxamarin.formsopacity

解决方案

Not knowing which Control MaterialCard inherite from .There is an sample about image ,maybe helpful to use.

XAML :

<Image x:Name="myimage" Source="icon.png">
    <Image.GestureRecognizers>
        <TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
    </Image.GestureRecognizers>
</Image>

ContentPage :

private void TapGestureRecognizer_Tapped(object sender, EventArgs e)
{
    Image image = sender as Image;
    image.Opacity = 0;
    image.FadeTo(1, 4000);
}

You can use Fading function to realize the animation when click it.

推荐阅读