我正在建立一个Xamarin跨平台应用程序!
我想在应用程序页面的右下角添加一个浮动操作按钮,就像这样
下面是我的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="Last_MSPL.Views.HomePage">
<ListView x:Name="Demolist" ItemSelected="OnItemSelected" BackgroundColor="AliceBlue">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.ContextActions>
<MenuItem x:Name="OnMore" Clicked="OnMore_Clicked" CommandParameter="{Binding .}"
Text="More" />
<MenuItem x:Name="OnDelete" Clicked="OnDelete_Clicked" CommandParameter="{Binding .}"
Text="Delete" IsDestructive="True" />
</ViewCell.ContextActions>
<StackLayout>
<StackLayout Padding="15,0">
<Label Text="{Binding employee_name}" FontAttributes="bold" x:Name="en"/>
<Label Text="{Binding employee_age}"/>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</ContentPage>
我怎样才能用XAML做到这一点?请帮助我完成这个,谢谢!
7条答案
按热度按时间inkz8wg91#
您可以使用
ImageButton
(Xamarin.Forms v3.4+)在您喜欢的编辑器中创建具有透明背景的图像,然后在页面上为其指定一个位置。
使用AbsoluteLayout的示例,只需将您的"FAB"作为最后一个元素,使其Z顺序最高,它将"浮动"在其余内容之上。
输出:
cetgtptt2#
**
如果你想要一个简单的解决方案,不需要下载库或任何东西,试试这个:
**
在你的xaml中你可以使用一个圆角的普通按钮,只要确保宽度和高度是一样的,要让它浮动,使用一个绝对布局,把按钮放在底部,我从app.xml资源字典中粘贴了我的和它的样式条目。
(Ive我使用了james montenago软件包和suave控件。前者在iOS上不起作用,后者在Android上不显示图像。这个解决方案在iOS和Android上都起作用。)
XAML:
资源字典条目:
(When高度和宽度均为50。)
nzrxty8p3#
在xamarin表单中添加一个浮动按钮非常简单。只需添加一个网格,其中一行的高度为"*”,在网格中添加一个滚动视图和一个按钮。行=“0”。在滚动视图中,放置您的设计表单。对于圆形的按钮,放置一些边框半径和高度请求,以及宽度请求应该是边框半径的两倍。另外,要在右下角显示它,put Margin=“0,0,20,22”.要在该按钮内显示图标,请将FontAwesome图标作为按钮的ImageSource. FontAwesome图标可以在单独的类中定义(如果您还需要如何使用FontAwesome图标的详细信息,请让我知道).
够了,你完了。
4smxwvx54#
最快的方法:
1.安装此Nuget:https://github.com/jamesmontemagno/FloatingActionButton-for-Xamarin.Android
1.按如下方式放置浮动操作按钮(FAB):
不要忘记将**“add.png”**图标添加到资源中
wz8daaqr5#
如果你想使用本地控件,你可以在Android上使用浮动操作按钮(https://developer.android.com/guide/topics/ui/floating-action-button),在iOS上使用自定义图板。否则,你可以在Xamarin.Forms页面上添加一个RelativeLayout容器和特定约束。
您可以使用任何其他控件更改按钮,并且只需更改“常量=-60”的值即可纠正位置
wkftcu5l6#
在
Xamarin Forms
中使用浮动操作按钮比你想象的要容易,你所需要的只是一点AbsoluteLayout和一个可以响应你点击的ImageButton
,瞧!你的FAB准备好了添加自定义
ImageButton
控件,如下所示:一旦你在一个父布局是AbsoluteLayout的布局中启动并运行了它,就可以添加ImageButton,如下所示:
其中customControls是添加ImageButton自定义控件的命名空间。
为了更好地理解,请检查我引用它的位置,可以找到here
祝你好运
如果您有任何类型的查询,请还原。
k5hmc34c7#
在实现浮动操作按钮时,我注意到这里的答案都没有覆盖按钮下方的阴影。下面是我的(hacky)解决方案,以获得FAB下方的阴影:
注:
ImageButton
的偏移量wrt,因此它显示在ImageButton
的右下方。1
。Transparent
在iOS上没有达到预期效果,01000000
工作得很好。ImageButton
必须低于Frame
,因为xaml顺序确定绘制顺序。Grid
放入另一个Grid
中,使其与其他内容重叠。