Android 如何使FloatingActionButton在ListView顶部工作并正确定位

我正在尝试让一个

SuaveControls.FloatingActionButton

在列表视图的顶部工作，如下页面上的示例-

我的

ListView

位于

StackLayout

中，因此我决定将它们包装到

AbsoluteLayout

这是视图/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"
             xmlns:views="clr-namespace:SuaveControls.Views;assembly=SuaveControls.FloatingActionButton"
             xmlns:local="clr-namespace:DPM.XForms"
             x:Class="DPM.XForms.ProjectListPage" 
             Title="Drive Plus Mobile"
             >
    <AbsoluteLayout>
        <StackLayout Orientation="Vertical" Spacing="1">

            <Label Text="TopBar             ..." BackgroundColor="Gray" HorizontalOptions="FillAndExpand" HorizontalTextAlignment="Center"/>
            <!-- Project Search/Filter toolbar-->
            <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" Padding="7" BackgroundColor="White">
                <Label Text="Projects " TextColor="DarkGray" Font="Bold,17" HorizontalOptions="Center" VerticalOptions="Center"/>
                <StackLayout Orientation="Horizontal" HorizontalOptions="EndAndExpand" Padding="0">
                    <Button Image="Search.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Image="LeftBS.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Image="CenteredBS.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Text="++" WidthRequest="27" HeightRequest="27" Clicked="CreateProject_Clicked"></Button>
                </StackLayout>
            </StackLayout>
            <Label Text="Pin projects" HorizontalOptions="FillAndExpand" HorizontalTextAlignment="Center" BackgroundColor="LightGray" HeightRequest="25" />



            <ListView x:Name="lvProjects" ItemTapped="OnProjectTapped" RowHeight="54" BackgroundColor="DarkGray">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <!-- Project Row -->
                            <StackLayout Orientation="Horizontal" HorizontalOptions="Fill" BackgroundColor="White" Margin="0,1,0,1" >
                                <Button 
                                Image="Colombia.png" 
                                BackgroundColor="White" 
                                HorizontalOptions="Center"
                                VerticalOptions="Center"
                                WidthRequest="54"
                                HeightRequest="54"
                                >
                                </Button>
                                <StackLayout Orientation="Vertical" HorizontalOptions="StartAndExpand">
                                    <Label 
                                    Text="{Binding Name}" 
                                    TextColor="Black"
                                    Font="Bold,17"
                                    HorizontalOptions="StartAndExpand"
                                    VerticalOptions="Start" 
                                />
                                    <Label 
                                   Text="{Binding Brand}" 
                                   TextColor="Black"
                                   HorizontalOptions="Start"
                                   VerticalOptions="Start" 
                                />
                                    <Label 
                                   Text=".." 
                                   TextColor="Black"
                                   HorizontalOptions="Start"
                                   VerticalOptions="End" 
                                />
                                </StackLayout>
                                <Button Text="3"  WidthRequest="44"></Button>
                                <Button Text=">"  WidthRequest="44" BackgroundColor="White" ></Button>

                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>
        <views:FloatingActionButton 
            Image="CreateProject.png" 

            WidthRequest="80" 
            HeightRequest="80" 
            HorizontalOptions="CenterAndExpand" 
            VerticalOptions="CenterAndExpand"
            Clicked="FloatingActionButton_Clicked"
            >

        </views:FloatingActionButton>
    </AbsoluteLayout>

</ContentPage>

不知道如何定位
浮动操作按钮
，使其始终位于任何设备的右下角

我还尝试将
FloatingActionButton
放置在当前StackLayout中，但它不浮动，只是添加到listview的下方或上方，如图所示


如果有不清楚的地方，请随意使用注释。
您可以删除绝对布局，因为您可以看到您的布局在横向模式下没有完全展开

你可以试试这个

<MainLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
    //YourTopBar
   // YourListView

  <StackLayout HorizontalOptions="End"
               VerticalOptions="End"
               Spacing="0"
               Margin="15">
       <YourFloatingButton />

  </StackLayout>
</MainLayout>


//你的上栏
//YourListView

主布局可以是网格或堆栈布局
您可以修改布局以使用网格和绝对布局包装listview和浮动按钮。所以它是这样的：（因为我没有你的列表数据源，简单地说，我只是放了一个模拟列表）



基于@Swift\u Talt答案和本次讨论-

我使用一（1）个单元格的网格找到了这个解决方案，其中ListView（背景）和FloatingActionButton位于同一个唯一的单元格上

这就是它的样子：



这是视图/页面

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:views="clr-namespace:SuaveControls.Views;assembly=SuaveControls.FloatingActionButton"
             xmlns:local="clr-namespace:DPM.XForms"
             x:Class="DPM.XForms.ProjectListPage" 
             Title="Drive Plus Mobile"
             >
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <StackLayout Grid.Row="0" Grid.Column="0" Orientation="Vertical" Spacing="1">

            <Label Text="TopBar             ..." BackgroundColor="Gray" HorizontalOptions="FillAndExpand" HorizontalTextAlignment="Center"/>
            <!-- Project Search/Filter toolbar-->
            <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" Padding="7" BackgroundColor="White">
                <Label Text="Projects " TextColor="DarkGray" Font="Bold,17" HorizontalOptions="Center" VerticalOptions="Center"/>
                <StackLayout Orientation="Horizontal" HorizontalOptions="EndAndExpand" Padding="0">
                    <Button Image="Search.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Image="LeftBS.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Image="CenteredBS.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Text="++" WidthRequest="27" HeightRequest="27" Clicked="CreateProject_Clicked"></Button>
                </StackLayout>
            </StackLayout>
            <Label Text="Pin projects" HorizontalOptions="FillAndExpand" HorizontalTextAlignment="Center" BackgroundColor="LightGray" HeightRequest="25" />



            <ListView x:Name="lvProjects" ItemTapped="OnProjectTapped" RowHeight="54" BackgroundColor="DarkGray">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <!-- Project Row -->
                            <StackLayout Orientation="Horizontal" HorizontalOptions="Fill" BackgroundColor="White" Margin="0,1,0,1" >
                                <Button 
                                Image="Colombia.png" 
                                BackgroundColor="White" 
                                HorizontalOptions="Center"
                                VerticalOptions="Center"
                                WidthRequest="54"
                                HeightRequest="54"
                                >
                                </Button>
                                <StackLayout Orientation="Vertical" HorizontalOptions="StartAndExpand">
                                    <Label 
                                    Text="{Binding Name}" 
                                    TextColor="Black"
                                    Font="Bold,17"
                                    HorizontalOptions="StartAndExpand"
                                    VerticalOptions="Start" 
                                />
                                    <Label 
                                   Text="{Binding Brand}" 
                                   TextColor="Black"
                                   HorizontalOptions="Start"
                                   VerticalOptions="Start" 
                                />
                                    <Label 
                                   Text=".." 
                                   TextColor="Black"
                                   HorizontalOptions="Start"
                                   VerticalOptions="End" 
                                />
                                </StackLayout>
                                <Button Text="3"  WidthRequest="44"></Button>
                                <Button Text=">"  WidthRequest="44" BackgroundColor="White" ></Button>

                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>
        <StackLayout Grid.Row="0" Grid.Column="0"  HorizontalOptions="End" VerticalOptions="End" Spacing="0" Margin="15">
            <views:FloatingActionButton 
            Image="CreateProject.png" 

            WidthRequest="80" 
            HeightRequest="80" 
            HorizontalOptions="CenterAndExpand" 
            VerticalOptions="CenterAndExpand"
            Clicked="FloatingActionButton_Clicked"
            >

            </views:FloatingActionButton>
        </StackLayout>
    </Grid>
</ContentPage>


使用这种方法会使“浮动”按钮显示为列表视图下的最后一行，因此不是浮动的，请参见我问题的第三个图像抱歉，我没有注意到“浮动”消失，我已修改了答案。感谢您的回答，但这会产生与我问题的第三个图像非常相似的结果，但按钮位于右侧和底部，但不浮动
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:views="clr-namespace:SuaveControls.Views;assembly=SuaveControls.FloatingActionButton"
             xmlns:local="clr-namespace:DPM.XForms"
             x:Class="DPM.XForms.ProjectListPage" 
             Title="Drive Plus Mobile"
             >
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <StackLayout Grid.Row="0" Grid.Column="0" Orientation="Vertical" Spacing="1">

            <Label Text="TopBar             ..." BackgroundColor="Gray" HorizontalOptions="FillAndExpand" HorizontalTextAlignment="Center"/>
            <!-- Project Search/Filter toolbar-->
            <StackLayout Orientation="Horizontal" HorizontalOptions="FillAndExpand" Padding="7" BackgroundColor="White">
                <Label Text="Projects " TextColor="DarkGray" Font="Bold,17" HorizontalOptions="Center" VerticalOptions="Center"/>
                <StackLayout Orientation="Horizontal" HorizontalOptions="EndAndExpand" Padding="0">
                    <Button Image="Search.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Image="LeftBS.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Image="CenteredBS.png" BackgroundColor="White" WidthRequest="27" HeightRequest="27"></Button>
                    <Button Text="++" WidthRequest="27" HeightRequest="27" Clicked="CreateProject_Clicked"></Button>
                </StackLayout>
            </StackLayout>
            <Label Text="Pin projects" HorizontalOptions="FillAndExpand" HorizontalTextAlignment="Center" BackgroundColor="LightGray" HeightRequest="25" />



            <ListView x:Name="lvProjects" ItemTapped="OnProjectTapped" RowHeight="54" BackgroundColor="DarkGray">
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <!-- Project Row -->
                            <StackLayout Orientation="Horizontal" HorizontalOptions="Fill" BackgroundColor="White" Margin="0,1,0,1" >
                                <Button 
                                Image="Colombia.png" 
                                BackgroundColor="White" 
                                HorizontalOptions="Center"
                                VerticalOptions="Center"
                                WidthRequest="54"
                                HeightRequest="54"
                                >
                                </Button>
                                <StackLayout Orientation="Vertical" HorizontalOptions="StartAndExpand">
                                    <Label 
                                    Text="{Binding Name}" 
                                    TextColor="Black"
                                    Font="Bold,17"
                                    HorizontalOptions="StartAndExpand"
                                    VerticalOptions="Start" 
                                />
                                    <Label 
                                   Text="{Binding Brand}" 
                                   TextColor="Black"
                                   HorizontalOptions="Start"
                                   VerticalOptions="Start" 
                                />
                                    <Label 
                                   Text=".." 
                                   TextColor="Black"
                                   HorizontalOptions="Start"
                                   VerticalOptions="End" 
                                />
                                </StackLayout>
                                <Button Text="3"  WidthRequest="44"></Button>
                                <Button Text=">"  WidthRequest="44" BackgroundColor="White" ></Button>

                            </StackLayout>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>
        </StackLayout>
        <StackLayout Grid.Row="0" Grid.Column="0"  HorizontalOptions="End" VerticalOptions="End" Spacing="0" Margin="15">
            <views:FloatingActionButton 
            Image="CreateProject.png" 

            WidthRequest="80" 
            HeightRequest="80" 
            HorizontalOptions="CenterAndExpand" 
            VerticalOptions="CenterAndExpand"
            Clicked="FloatingActionButton_Clicked"
            >

            </views:FloatingActionButton>
        </StackLayout>
    </Grid>
</ContentPage>