Xamarin.Forms - x:参考第2级

时间:2017-08-14 14:43:32

标签: xaml xamarin xamarin.forms

我目前正在为我的应用程序使用新的ContentPage,并且我有一些DataTemplates控件。

我想在其中一个DataTemplates中使用我的ContentPage的ViewModel中的Command,但是我不确定如何正确引用它以使其正常工作。这是我的XAML代码:

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage 
    xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
    x:Class="MaverickMobileOnline.ImagesListingPage"

    --MANY NAMESPACE REFERENCES--
    >


    <ContentPage.Resources>
        <ResourceDictionary>
          <c:ItemTappedEventArgsConverter x:Key="ItemTappedConverter" />
          <c:ItemAppearingEventArgsConverter x:Key="ItemAppearingConverter" />
          <c:BooleanNegationConverter x:Key="not" />
        </ResourceDictionary>
    </ContentPage.Resources>

    <StackLayout Spacing="0">
        <commonViews:MainCustomNavBar MinimumHeightRequest="120" />


        <controls:PullToRefreshLayout
          x:Name = "layout" 
          RefreshCommand="{Binding btn_reload_businesses_images_click}"    
          IsEnabled = "True"        
          IsRefreshing="{Binding Path=is_businesses_loading}" > 

          <ScrollView
            x:Name = "scrollView"
            HorizontalOptions="FillAndExpand"
            VerticalOptions="FillAndExpand">

               <templates:ItemsStack 
                    Padding="0" 
                    Margin="0,10,0,10"
                    x:Name="itmStack"
                    BackgroundColor="White"  
                    ItemsSource="{Binding Path=photos_list}">

                <templates:ItemsStack.ItemTemplate>
                    <DataTemplate>

                        <artina:GridOptionsView 

                                Padding="10,0" 
                                ColumnSpacing="10" 
                                RowSpacing="10" 
                                VerticalOptions="Fill" 
                                HeightRequest="120"
                                ColumnCount="3"
                                RowCount="1"
                                ItemsSource="{Binding Path=.}">

                                <artina:GridOptionsView.ItemTemplate>
                                    <DataTemplate>

                                        <ContentView 
                                            xmlns="http://xamarin.com/schemas/2014/forms" 
                                            xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
                                            x:Class="MaverickMobileOnline.GalleryImageItemTemplate"
                                            xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
                                            xmlns:fftransformations="clr-namespace:FFImageLoading.Transformations;assembly=FFImageLoading.Transformations">

                                            <ContentView.Content>
                                                <ffimageloading:CachedImage
                                                    FadeAnimationEnabled="true" 
                                                    Aspect="AspectFill"
                                                    VerticalOptions="FillAndExpand" 
                                                    HorizontalOptions="FillAndExpand"

                                                    LoadingPlaceholder="advertising_photo_placeholder.png"
                                                    Source="{Binding Path=image_medium}" />
                                            </ContentView.Content>

                                            <ContentView.GestureRecognizers>
                                                <TapGestureRecognizer 
                                                    -- HERE! --

                                                    Command="{Binding Source={x:Reference X}, Path=BindingContext.command_name}" 
                                                    CommandParameter="{Binding image_medium}"
                                                />
                                            </ContentView.GestureRecognizers>

                                        </ContentView>

                                    </DataTemplate>
                                </artina:GridOptionsView.ItemTemplate>
                            </artina:GridOptionsView>

                    </DataTemplate>
                </templates:ItemsStack.ItemTemplate>
            </templates:ItemsStack>

          </ScrollView>
        </controls:PullToRefreshLayout> 

    </StackLayout>

</ContentPage>

请在标记后查看代码&#34; - 这里! - &#34;

PS:我正在改进此布局,以提高效果。

任何帮助将不胜感激。

更新

视图模型:

public RelayCommand<string> btn_image_tap_preview
{
    get
    {
        return new RelayCommand<string>(
            OpenImagePreview
        );
    }
}

//* Image tap
private async void OpenImagePreview(string url)
{
    //* Some code
}

更新了XAML:

<StackLayout x:Name="mainStack" Spacing="0">
        <commonViews:MainCustomNavBar MinimumHeightRequest="120" />
....
 <ContentView.GestureRecognizers>
   <TapGestureRecognizer Command="{Binding Source={x:Reference mainStack}, Path=BindingContext.btn_image_tap_preview}" 
                         CommandParameter="{Binding image_medium}" />
 </ContentView.GestureRecognizers>

我正在调试但我无法访问ViewModel的命令。

1 个答案:

答案 0 :(得分:0)

您可以使用x:Reference并获取内容页面中任何布局或元素的绑定上下文,例如StackLayout。由于它的绑定上下文是页面的ViewModel,因此它将具有您在第一级本身查找的命令。你可以直接使用它。

<StackLayout x:Name="myStackLayout" Spacing="0">
        <commonViews:MainCustomNavBar MinimumHeightRequest="120" />
....
 <ContentView.GestureRecognizers>
   <TapGestureRecognizer Command="{Binding Source={x:Reference myStackLayout}, Path=BindingContext.command_name}" 
                         CommandParameter="image_medium" />
 </ContentView.GestureRecognizers>

或者您可以为TapGesture设置绑定上下文

<TapGestureRecognizer BindingContext="{Binding Source={x:Reference myStackLayout.BindingContext}}" Command="{Binding command_name}"

DataTemplates似乎与v1.4.4之前的x:Reference无效,您可以在论坛帖子中了解更多信息 - x:Reference not working?。 可以在答案here中看到新版本中的实现。 如果您有兴趣,已修复的Bugzilla问题是here