フローティングアクションを実装するbottom_right listview - Xamarin.forms

Question

私は画像をバインドするリストビューを持っています&テキスト。私はこのページの右下にフローティングボタンを追加しようとしていましたが、役に立たなかったのです。いくつかの研究を行ったが、まだこれに対する明確な解決策はないようだ。私はこれを実装する方法を知っている人は誰ですか？私のxamlコードでは、私が試したことを示しました。

私の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="LoyaltyWorx.Page1" 
       Title="Stores"> 
     <ContentPage.ToolbarItems> 

      <ToolbarItem Text="About" 
         Icon="ic_action_more_vert.png" 
         Priority="0" 
         Order="Secondary" 
         Clicked="ToolbarItem_Clicked"/> 

      <ToolbarItem Text="Settings" 
         Icon="ic_action_more_vert.png" 
         Priority="0" 
         Order="Secondary"/> 

     </ContentPage.ToolbarItems> 


     <ListView x:Name="MainListView" HasUnevenRows="True" ItemTapped="MainListView_ItemTapped" SeparatorColor="DarkGray"> 
      <ListView.ItemTemplate> 
       <DataTemplate> 

        <ImageCell ImageSource="{Binding Image}" Text="{Binding Name}" TextColor="Black" /> 


       </DataTemplate> 

      </ListView.ItemTemplate> 
     </ListView> 

***//here is what I attempted but the image just covers the whole page*** 
     <Image Source="add.png" 
        VerticalOptions="FillAndExpand" 
        HorizontalOptions="FillAndExpand" 
       HeightRequest="0" 
       WidthRequest="0" 
        AbsoluteLayout.LayoutBounds="1,.99, 65, 65" 
        AbsoluteLayout.LayoutFlags="PositionProportional" > 
      <Image.GestureRecognizers> 
       <TapGestureRecognizer 
        Command="{Binding clickNewCard}" 
        CommandParameter="3" /> 
      </Image.GestureRecognizers> 
     </Image> 

    </ContentPage> 

Answer 1

（下手な英語のため申し訳ありませんが）

多くの問題がここにあります：

1. あなたがContentPageの内容を設定している場合は、あなたが宣言する必要があります 要素が1つだけです（StackLayoutのようなレイアウトコンテナを使用する必要があります。複数の子を処理できるため、ページを構成できます）。約this topicを参照してください。
2. AbsoluteLayoutの添付プロパティは設定していますが、画像はAbsoluteLayoutの内側にはありません。 This topic AbsoluteLayout（あなたがここで必要なものではないと思う）。
3. 実際にこのプロパティをListViewに設定する必要がある場合は、VerticalOptions="FillAndExpand"とHorizontalOptions="FillAndExpand"をイメージビューに設定しています。 This topicはLayoutOptionsについてです。

この方法を試してみて、それがあなたのために働くなら、私に教え：

<?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="LoyaltyWorx.Page1" 
      Title="Stores"> 
    <ContentPage.ToolbarItems> 
     <ToolbarItem Text="About" 
        Icon="ic_action_more_vert.png" 
        Priority="0" 
        Order="Secondary" 
        Clicked="ToolbarItem_Clicked"/> 
     <ToolbarItem Text="Settings" 
        Icon="ic_action_more_vert.png" 
        Priority="0" 
        Order="Secondary"/> 
    </ContentPage.ToolbarItems> 
    <Grid> 
     <ListView Grid.Column="0" Grid.Row="0" 
        x:Name="MainListView" 
        HasUnevenRows="True" 
        VerticalOptions="FillAndExpand" 
        HorizontalOptions="FillAndExpand" 
        ItemTapped="MainListView_ItemTapped" 
        SeparatorColor="DarkGray"> 
      <ListView.ItemTemplate> 
       <DataTemplate> 
        <ImageCell ImageSource="{Binding Image}" 
           Text="{Binding Name}" 
           TextColor="Black" /> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
     <Image Grid.Column="0" Grid.Row="0" 
       Source="add.png" 
       HorizontalOptions="EndAndExpand" 
       VerticalOptions="EndAndExpand" 
       Margin="0,0,30,30" 
       HeightRequest="0" 
       WidthRequest="0" > 
      <Image.GestureRecognizers> 
       <TapGestureRecognizer 
        Command="{Binding clickNewCard}" 
        CommandParameter="3" /> 
      </Image.GestureRecognizers> 
     </Image> 
    </Grid> 
</ContentPage>