You can also check out this GitHub repository: https://github.com/ResoCoder/FabMenuXamarinAndroid
MainActivity.cs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
|
using Android.App;
using Android.Widget;
using Android.OS;
using Android.Support.V7.App;
using Android.Support.Design.Widget;
using Android.Views;
using System;
using Android.Animation;
namespace FabMenuTut
{
[Activity(Label = "FabMenuTut", MainLauncher = true)]
public class MainActivity : AppCompatActivity
{
private static bool isFabOpen;
private FloatingActionButton fabAirballoon;
private FloatingActionButton fabCake;
private FloatingActionButton fabMain;
private View bgFabMenu;
protected override void OnCreate(Bundle savedInstanceState)
{
base.OnCreate(savedInstanceState);
// Set our view from the "main" layout resource
SetContentView(Resource.Layout.Main);
fabAirballoon = FindViewById<FloatingActionButton>(Resource.Id.fab_airballoon);
fabCake = FindViewById<FloatingActionButton>(Resource.Id.fab_cake);
fabMain = FindViewById<FloatingActionButton>(Resource.Id.fab_main);
bgFabMenu = FindViewById<View>(Resource.Id.bg_fab_menu);
fabMain.Click += (o, e) =>
{
if (!isFabOpen)
ShowFabMenu();
else
CloseFabMenu();
};
fabCake.Click += (o, e) =>
{
CloseFabMenu();
Toast.MakeText(this, "Cake!", ToastLength.Short).Show();
};
fabAirballoon.Click += (o, e) =>
{
CloseFabMenu();
Toast.MakeText(this, "Airballoon!", ToastLength.Short).Show();
};
bgFabMenu.Click += (o, e) => CloseFabMenu();
}
private void ShowFabMenu()
{
isFabOpen = true;
fabAirballoon.Visibility = ViewStates.Visible;
fabCake.Visibility = ViewStates.Visible;
bgFabMenu.Visibility = ViewStates.Visible;
fabMain.Animate().Rotation(135f);
bgFabMenu.Animate().Alpha(1f);
fabAirballoon.Animate()
.TranslationY(-Resources.GetDimension(Resource.Dimension.standard_100))
.Rotation(0f);
fabCake.Animate()
.TranslationY(-Resources.GetDimension(Resource.Dimension.standard_55))
.Rotation(0f);
}
private void CloseFabMenu()
{
isFabOpen = false;
fabMain.Animate().Rotation(0f);
bgFabMenu.Animate().Alpha(0f);
fabAirballoon.Animate()
.TranslationY(0f)
.Rotation(90f);
fabCake.Animate()
.TranslationY(0f)
.Rotation(90f).SetListener(new FabAnimatorListener(bgFabMenu, fabCake, fabAirballoon));
}
private class FabAnimatorListener : Java.Lang.Object, Animator.IAnimatorListener
{
View[] viewsToHide;
public FabAnimatorListener(params View[] viewsToHide)
{
this.viewsToHide = viewsToHide;
}
public void OnAnimationCancel(Animator animation)
{
}
public void OnAnimationEnd(Animator animation)
{
if (!isFabOpen)
foreach (var view in viewsToHide)
view.Visibility = ViewStates.Gone;
}
public void OnAnimationRepeat(Animator animation)
{
}
public void OnAnimationStart(Animator animation)
{
}
}
}
}
|
Main.axml
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
|
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="Hello FAB menu!"
android:textSize="24sp"/>
<View
android:id="@+id/bg_fab_menu"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#48000000"
android:alpha="0"
android:visibility="gone"/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_airballoon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/standard_23"
android:visibility="gone"
android:rotation="90"
app:fabSize="mini"
app:srcCompat="@drawable/ic_airballoon"/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_cake"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/standard_23"
android:visibility="gone"
android:rotation="90"
app:fabSize="mini"
app:srcCompat="@drawable/ic_cake"/>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_margin="@dimen/fab_margin"
app:fabSize="normal"
app:srcCompat="@drawable/ic_plus"/>
</android.support.design.widget.CoordinatorLayout>
|
dimens.xml
1
2
3
4
5
6
7
8
9
|
<resources>
<dimen name="fab_margin">16dp</dimen>
<dimen name="standard_12">12dp</dimen>
<dimen name="standard_23">23dp</dimen>
<dimen name="standard_55">55dp</dimen>
<dimen name="standard_100">100dp</dimen>
<dimen name="standard_145">145dp</dimen>
</resources>
|
AndroidManifest.xml
1
2
3
4
5
6
7
8
9
10
11
|
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="FabMenuTut.FabMenuTut"
android:versionCode="1"
android:versionName="1.0">
<uses-sdk android:minSdkVersion="21" />
<application android:allowBackup="true"
android:label="@string/app_name"
android:theme="@style/Theme.AppCompat.Light.DarkActionBar">
</application>
</manifest>
|


0 comments:
Post a Comment
Note: only a member of this blog may post a comment.