Giter Site home page Giter Site logo

Comments (2)

fabionuno avatar fabionuno commented on June 23, 2024

Unfortunately the FloatingActionMenu only works when Inflated by a XML layout because some initialisations are done by the onFinishInflate method.

I will try to send a PR to the original Java version to fix this issue.

You will need to create a Android Layout with the FloatingActionMenu, Inflate it and add the view in your Forms layout.
I don't think this is the best solution but, at this moment, it works.

FabFormsPage.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="FabForms.FabFormsPage"
    Title="Xaml Example"
    BackgroundColor="White">
    <RelativeLayout x:Name="body">
        <ListView
            x:Name="list"
            BackgroundColor="White"
            RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1}"
            RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1}">
            >
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell
                        Text="{Binding .}" />
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </RelativeLayout>
</ContentPage>

FabFormsPage.cs

using System.Collections.Generic;
using Xamarin.Forms;
using System;

#if __ANDROID__
using Xamarin.Forms.Platform.Android;
using Clans.Fab;
using Android.Views;
using Android.Widget;
#endif

namespace FabForms
{
    public partial class FabFormsPage : ContentPage
    {
        public FabFormsPage()
        {
            InitializeComponent();

            var items = new List<string>();
            for (int i = 0; i < 50; i++)
            {
                items.Add(string.Format("Item {0}", i));
            }

            this.list.ItemsSource = items;

            #if __ANDROID__
            LayoutInflater inflater = LayoutInflater.From(Forms.Context);
            var view = inflater.Inflate(Droid.Resource.Layout.fam_layout, null, false);

            var fam = view.FindViewById<FloatingActionMenu>(Droid.Resource.Id.menu_red);
            fam.SetClosedOnTouchOutside(true);
            this.body.Children.Add(view);
            #endif
        }
    }
}

fam_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:fab="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <com.github.clans.fab.FloatingActionMenu
        android:id="@+id/menu_red"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:paddingRight="10dp"
        android:paddingBottom="10dp"
        android:paddingLeft="10dp"
        fab:menu_labels_ellipsize="end"
        fab:menu_labels_singleLine="true"
        fab:menu_backgroundColor="#ccffffff"
        fab:menu_fab_label="Menu label">
        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/fab1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_edit"
            fab:fab_size="mini"
            fab:fab_label="Disabled" />
        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/fab2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_edit"
            fab:fab_size="mini"
            fab:fab_label="Remove button" />
        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/fab3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/ic_edit"
            fab:fab_size="mini"
            fab:fab_label="Restore Button" />
    </com.github.clans.fab.FloatingActionMenu>
</FrameLayout>

from floatingactionbutton-xamarin.android.

matteopiccioni avatar matteopiccioni commented on June 23, 2024

Thank you very much! 👍

from floatingactionbutton-xamarin.android.

Related Issues (11)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.