As promised, here is another release of one of my GitHub libraries for Xamarin! This time we are talking about the
FloatingActionButton or “FAB”!
Here are some important links:
GitHub project: https://github.com/SuavePirate/Xamarin.Forms.Controls.FloatingActionButton
NuGet package: https://www.nuget.org/packages/SuaveControls.FloatingActionButton
Don’t forget to read up on my original post on how to create your own
FloatingActionButton and how to use it: Xamarin.Controls – Xamarin.Forms FloatingActionButton (including iOS!)
A custom view to create a FloatingActionButton for both Android and iOS as part of Material Design
That’s right, even on iOS!
How to use
Clone the repository and open include the
src projects in your Xamarin.Forms and Platform projects.
Now Available on NuGet!
Special note for iOS: Make sure to call
FloatingActionButtonRenderer.InitRenderer(); in your
AppDelegate.cs in order to avoid linking it out.
Then you can include it in your XAML or call it from C# (See the example projects for a demo):
<?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:local="clr-namespace:SuaveControls.FabExample" xmlns:controls="clr-namespace:SuaveControls.Views;assembly=SuaveControls.FloatingActionButton" x:Class="SuaveControls.FabExample.MainPage"> <StackLayout Margin="32"> <Label Text="This is a Floating Action Button!" VerticalOptions="Center" HorizontalOptions="Center"/> <controls:FloatingActionButton x:Name="FAB" HorizontalOptions="CenterAndExpand" WidthRequest="50" HeightRequest="50" VerticalOptions="CenterAndExpand" Image="ic_add_white.png" ButtonColor="#03A9F4" Clicked="Button_Clicked"/> </StackLayout> </ContentPage>
- Make it more flexible. Add Different color states, add sizing adjustments, etc.
- Create UWP implementation
- Create Xamarin Component
Come support the project and join the contributors list! We would love to see this
TODO list dropped to nothing!
If you like what you see, don’t forget to follow me on twitter @Suave_Pirate, check out my GitHub, and subscribe to my blog to learn more mobile developer tips and tricks!
Interested in sponsoring developer content? Message @Suave_Pirate on twitter for details.
13 thoughts on “Xamarin.Forms Floating Action Button NuGet Announcement”
after installing the package via nuget and trying to use the same in visual studio 2017, the button does not show the color set and the edges are square, is there anything else that needs to be done?
Did you install it in your platform projects as well? It seems like the renderer isn’t being loaded
yes, it is installed in the projects of each platform.
What platform isn’t working?
android, iOS has not been tested
Perhaps the renderer is being linked out. What are your linker settings?
is set to none
Xamarin.Forms version 22.214.171.1242
Check out the example project on GitHub. It actually uses the nuget package too!
hi alex i cant installing the package this error
Attempting to gather dependency information for package ‘SuaveControls.FloatingActionButton.2017.11.27’ with respect to project ‘ContPagos’, targeting ‘.NETPortable,Version=v4.5,Profile=Profile259’
It does not support .NETPortable Profile259. It only supports Profile111
LikeLiked by 1 person
i change profile111 but is showing error Attempting to resolve dependencies for package ‘SuaveControls.FloatingActionButton.2017.11.27’ with DependencyBehavior ‘Lowest’
Circular dependency detected ‘SuaveControls.FloatingActionButton 2017.11.27 => SuaveControls.FloatingActionButton 2017.11.27’.
There is a bug tracked in github for this that I’m looking into
Thank you for reconfirming