Xamarin表單中的圖像點擊事件

Question

分類主頁

類別XAML代碼段->

                        <StackLayout Grid.Column ="1" Grid.Row ="0"  Orientation ="Vertical" BackgroundColor ="White" Padding ="10" HorizontalOptions ="FillAndExpand">
                            <Image Source ="banking.png" HorizontalOptions ="CenterAndExpand "/>
                            <Label Text ="Finance" FontSize ="Small " HorizontalOptions ="FillAndExpand" HorizontalTextAlignment ="Center"/>
                        </StackLayout>

                        <StackLayout Grid.Column ="2" Grid.Row ="0"  Orientation ="Vertical" BackgroundColor ="White" Padding ="10" HorizontalOptions ="FillAndExpand">
                            <Image Source ="legal.png" HorizontalOptions ="CenterAndExpand "/>
                            <Label Text ="Legal" FontSize ="Small " HorizontalOptions ="FillAndExpand" HorizontalTextAlignment ="Center"/>
                        </StackLayout>

請幫忙。 我需要的是能夠將一個名為“ CategoryName”的變量傳遞給我的SearchAPI Controller並檢索具有該類別的所有數據庫條目。 我的SearchAPIController如下所示

  [Route("api/Oppotunities/Search/{keyword}")]
    [ResponseType(typeof(List<Oppotunity>))]
    public async Task<IHttpActionResult> GetOppotunitiesByKeyword(string keyword)
    {
        List<Oppotunity> oppotunities = db.Oppotunities
            .Where(oppotunity => oppotunity.Title.Contains(keyword)
                                 || oppotunity.Description.Contains(keyword)
                                 || oppotunity.Category.Contains(keyword)
                                 || oppotunity.Organisation.Contains(keyword)).ToList();
        if (oppotunities == null)
        {
            return NotFound();
        }

        return Ok(oppotunities);
    } 

Answer 1

Xamarin表單中的圖像點擊事件

您需要在xaml中為Image控件命名

<Image Source ="banking.png" x:Name="imageFinance" HorizontalOptions ="CenterAndExpand "/>

然后，在同一文件后面的代碼中，創建TapGestureRecognizer並將其添加到該Image

var tapFinance = new TapGestureRecognizer();
tapFinance.Tapped += async (s, e) =>
{
 //your code
};
imageFinance.GestureRecognizers.Add(tapFinance);

Answer 2

我建議您重組XAML代碼設計。 查看您的代碼段，發布的屏幕截圖，以及從對CGPA6.4的答案的評論，您可以通過創建自定義視圖並將信息綁定到該視圖來簡化您的工作。 例如，下面的代碼：

<StackLayout 
    Grid.Column="2" 
    Grid.Row="0"  
    Orientation="Vertical" 
    BackgroundColor="White" 
    Padding="10" 
    HorizontalOptions="FillAndExpand">
    <Image 
        Source="legal.png" 
        HorizontalOptions="CenterAndExpand "/>
    <Label 
        Text="Legal" 
        FontSize="Small" 
        HorizontalOptions="FillAndExpand" 
        HorizontalTextAlignment="Center"/>
</StackLayout>

可以變成一個自定義控件，例如：

<MyCustomControl 
    Grid.Column="2" 
    Grid.Row="0" 
    ImageFile="legal.png"
    Text="Legal" />

這將通過大量的簡化您的XAML。 然后，您可以實現Action或EventHandler屬性以在點擊特定視圖時進行處理，然后可以將自定義控件轉換為：

<MyCustomControl 
    Grid.Column="2" 
    Grid.Row="0" 
    ImageFile="legal.png"
    Text="Legal" 
    OnControlTap="OnLegalViewTap"/>

因為看起來（從圖像中）您將反復使用同一視圖，所以您應該查看實現FlexLayout而不是Grid並使用Binding將圖像文件，文本和點擊處理程序附加到視圖，將進一步簡化您的XAML和代碼結構！