Xamarin 表单更改和启用图像按钮

Question

Sample UI design

有人知道如何更改 Imagebutton 源吗？参考图片链接，当用户点击step1（MainPage）时，它会将用户重定向到另一个页面（SecondPage）。一旦用户单击 SecondPage 中的“完成”按钮，我想更改我的 imagebutton 源，同时启用单击事件。我不确定不要从一个页面调用该函数。

（P.S 我的 btnclickcount 有时似乎不起作用...我只想记录第一次按钮单击时的开始日期时间）

    public partial class MainPage : ContentPage
    {
    public string mainpagevalue;

    int offlinecount = 0;
    int onlinecount = 0;

    public MainPage()
    {
        InitializeComponent();

    }
    private void btnOffline_Clicked(object sender, EventArgs e)
    {
        offlinecount++;
        txtOfflineStatus.Text = "IN PROGRESS";

        Navigation.PushAsync(new SecondPage(this, lblEndDT, txtOfflineStatus, btnOnline, btnMH));


        if (offlinecount == 1)
        {
            string currentDT = DateTime.Now.ToString();
            lblStartDT.Text = currentDT;
        }


    }

    private void btnOnline_Clicked(object sender, EventArgs e)
    {
        onlinecount++;

        txtOnlineStatus.Text = "IN PROGRESS";

        Navigation.PushAsync(new ThirdPage(this, lblOnlineEndDT, btnTS, txtOnlineStatus));

        if (onlinecount == 1)
        {
            string onlinestartDT = DateTime.Now.ToString();
            lblOnlineStartDT.Text = onlinestartDT;
        }

    }

第三页

 public partial class ThirdPage : ContentPage
{
    Label wopLblOnlineEndDT;
    MainPage mainpage;
    ImageButton btntroubleshoot;
    Label wolblOnlineStatus;

    public ThirdPage()
    {
        InitializeComponent();

    }
    public ThirdPage(MainPage woPage, Label lblOnlineEndDT, ImageButton btnTS, Label lblOnlineStatus)
    {
        InitializeComponent();
        mainpage = woPage;
        wopLblOnlineEndDT = lblOnlineEndDT;
        btntroubleshoot = btnTS;
        wolblOnlineStatus = lblOnlineStatus;
    }
    private void BtnDone_Clicked(object sender, EventArgs e)
    {
        string edt = DateTime.Now.ToString();
        wopLblOnlineEndDT.Text = edt;
        mainpage.mainpagevalue = wopLblOnlineEndDT.Text;
        btntroubleshoot.Source = "troubleshooting";
        btntroubleshoot.IsEnabled = true;
        wolblOnlineStatus.Text = "COMPLETED";
        wolblOnlineStatus.TextColor = Color.FromRgb(0, 214, 54);
        Navigation.PopAsync();
    }
}

XAML

 <ImageButton x:Name="btnOffline" IsEnabled="True" Source="@drawable/offlinetool.png" Grid.Row="1" Grid.Column="1" BackgroundColor="Transparent" Clicked="btnOffline_Clicked"/>
        <Label Text="Offline Tool" Grid.Row="2" Grid.Column="1" Margin="15,0,0,0"/>
        <ImageButton Source="@drawable/material.png" Grid.Row="4" Grid.Column="1" BackgroundColor="Transparent"/>
        <Label Text="Material Handler" Grid.Row="5" Grid.Column="1" />
        <Image Source="@drawable/Picture1.png" Grid.Row="6" Grid.ColumnSpan="6" BackgroundColor="Transparent"/>

        <Label Text="Start Date Time:" Grid.Row="1" Grid.Column="3"/>
        <Label Text="End Date Time:" Grid.Row="1" Grid.Column="3" Margin="7,40,0,0"/>
        <Label Text="Status:" Grid.Row="2" Grid.Column="3" Margin="58,0,0,0" />
        <Label x:Name="txtOfflineStatus" Text="NOT STARTED" TextColor="Red" Grid.Column="4" Grid.Row="2"/>
        <Label x:Name="lblStartDT" Text="" Grid.Column="4" Grid.Row="1"/>
        <Label x:Name="lblEndDT" Text="-" Grid.Column="4" Grid.Row="1" Margin="0,40,0,0"/>

        <Label Text="Start Date Time:" Grid.Row="4" Grid.Column="3"  />
        <Label Text="End Date Time:" Grid.Row="4" Grid.Column="3" Margin="7,40,0,0"/>
        <Label Text="Status:" Grid.Row="5" Grid.Column="3" Margin="58,0,0,0" />
        <Label Text="NOT STARTED" TextColor="Red" Grid.Column="4" Grid.Row="5"/>


        <!--#Online Tool-->
        <ImageButton x:Name="btnOnline" Source="@drawable/ot.png" Grid.Row="8" Grid.Column="1" BackgroundColor="Transparent" Clicked="btnOnline_Clicked" IsEnabled="False"/>
        <Label Text="Online Tool" Grid.Row="9" Grid.Column="1" Margin="19,0,0,0"/>
        <ImageButton x:Name="btnMH" Source="@drawable/mh.png" Grid.Row="11" Grid.Column="1" BackgroundColor="Transparent" Clicked="imgbtnMH_Clicked" IsEnabled="False"/>
        <Label Text="Material Handler" Grid.Row="12" Grid.Column="1"/>
        <Image Source="@drawable/Picture1.png" Grid.Row="13" Grid.ColumnSpan="6" BackgroundColor="Transparent"/>

        <Label Text="Start Date Time:" Grid.Row="8" Grid.Column="3" />
        <Label Text="End Date Time:" Grid.Row="8" Grid.Column="3" Margin="7,40,0,0"/>
        <Label Text="Status:" Grid.Row="9" Grid.Column="3" Margin="58,0,0,0" />
        <Label Text="NOT STARTED" TextColor="Red" Grid.Column="4" Grid.Row="9"/>
        <Label x:Name="lblOnlineStartDT" Text="00:00:00" Grid.Column="4" Grid.Row="8"/>
        <Label x:Name="lblOnlineEndDT" Text="" Grid.Column="4" Grid.Row="8" Margin="0,40,0,0"/>
        <Label x:Name="txtOnlineStatus" Text="NOT STARTED" TextColor="Red" Grid.Column="4" Grid.Row="9"/>

Answer 1

您也可以将imageButton 的引用传递给SecondPage，并在 done 方法中更改Source。让我告诉你怎么做：

在 MainPage xaml 中，创建一个名为 MyImageButton 的 ImageButton：

<StackLayout>
    <!-- Place new controls here -->

    <Label x:Name="lblStartDT" Text="startTest" 
           HorizontalOptions="Center"
           VerticalOptions="CenterAndExpand"/>

    <Button Text="go to secondPage" Clicked="btnOffline_Clicked"  HorizontalOptions="Center"
       VerticalOptions="CenterAndExpand"/>

    <Label x:Name="lblEndDT" Text="endTest" 
       HorizontalOptions="Center"
       VerticalOptions="CenterAndExpand" />

    <ImageButton x:Name="MyImageButton" Source="Images.png" IsEnabled="False" 
                HorizontalOptions="Center"
                VerticalOptions="CenterAndExpand" />

</StackLayout>

在后面的代码中，将MyImageButton 传递给SecondPage：

    private void btnOffline_Clicked(object sender, EventArgs e)
    {
        //Pass the parametere you need when you go to SecondPage 
        //Navigation.PushAsync(new SecondPage(this, lblEndDT));

        Navigation.PushAsync(new SecondPage(this, lblEndDT, MyImageButton));

        string currentDT = DateTime.Now.ToString();
        lblStartDT.Text = currentDT;

    }

在SecondPage中，获取myImageBtn的引用并在done方法中修改：

public partial class SecondPage : ContentPage
{
    Label MainPagelblEndDT;
    MainPage mainPage;
    ImageButton myImageBtn;
    public SecondPage()
    {
        InitializeComponent();
    }

    public SecondPage(MainPage mainP,Label lblEndDT)
    {
        InitializeComponent();

        //Get the lblEndDT reference here
        MainPagelblEndDT = lblEndDT;
        //Get the MainPage reference here
        mainPage = mainP;
    }

    public SecondPage(MainPage mainP, Label lblEndDT, ImageButton imageBtn)
    {
        InitializeComponent();

        //Get the lblEndDT reference here
        MainPagelblEndDT = lblEndDT;
        //Get the MainPage reference here
        mainPage = mainP;
        //Get the ImageButton reference here
        myImageBtn = imageBtn;
    }

    private void Button_Clicked(object sender, EventArgs e)
    {           
        string edt = DateTime.Now.ToString();

        //Use it
        MainPagelblEndDT.Text = edt;      

        mainPage.previouspagevalue = MainPagelblEndDT.Text;

        //change the source of imageBtn
        myImageBtn.Source = "Images1";
        myImageBtn.IsEnabled = true;

        Navigation.PopAsync();
    }
}

一个示例项目可用here。

Answer 2

将按钮不透明度绑定到 0.5 之类的值并禁用按钮。

                    <ImageButton Command="{Binding EditActivityCommand}"
                                 BackgroundColor="Transparent"
                                 Opacity="{Binding Opacity}"
                                 IsEnabled="{Binding IsAdmin}">