Android 帶有彈出收縮動(dòng)畫(huà)的扇形菜單實(shí)例
更新時(shí)間：2017年06月27日 10:57:25 作者：大西瓜的小桃子
本篇文章主要介紹了Android 帶有彈出收縮動(dòng)畫(huà)的扇形菜單實(shí)例，具有一定的參考價(jià)值，有興趣的可以了解一下
最近試著做了個(gè)Android 帶有彈出收縮動(dòng)畫(huà)的扇形菜單，留個(gè)筆記記錄一下。
效果如下
public class MainActivity extends AppCompatActivity implements View.OnClickListener {
private ImageView imgPublish;
private TextView textView1;
private TextView textView2;
private boolean isMenuOpen = false;
private List<TextView> textViews = new ArrayList<>();
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
imgPublish = (ImageView) findViewById(R.id.img_publish);
textView1 = (TextView) findViewById(R.id.tv_1);
textView2 = (TextView) findViewById(R.id.tv_2);
textViews.add(textView1);
textViews.add(textView2);
imgPublish.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()) {
case R.id.img_publish:
if (!isMenuOpen) {
showOpenAnim(80);
imgPublish.setImageResource(R.mipmap.publish_select);
}else {
showCloseAnim(80);
imgPublish.setImageResource(R.mipmap.fabu);
}
break;
}
}
//打開(kāi)扇形菜單的屬性動(dòng)畫(huà)， dp為半徑長(zhǎng)度
private void showOpenAnim(int dp) {
textView1.setVisibility(View.VISIBLE);
textView2.setVisibility(View.VISIBLE);
//for循環(huán)來(lái)開(kāi)始小圖標(biāo)的出現(xiàn)動(dòng)畫(huà)
for (int i = 0; i < textViews.size(); i++) {
AnimatorSet set = new AnimatorSet();
//標(biāo)題1與x軸負(fù)方向角度為20°，標(biāo)題2為100°，轉(zhuǎn)換為弧度
double a = -Math.cos(20 * Math.PI / 180 * (i * 2 + 1));
double b = -Math.sin(20 * Math.PI / 180 * (i * 2 + 1));
double x = a * dip2px(dp);
double y = b * dip2px(dp);
set.playTogether(
ObjectAnimator.ofFloat(textViews.get(i), "translationX", (float) (x * 0.25), (float) x),
ObjectAnimator.ofFloat(textViews.get(i), "translationY", (float) (y * 0.25), (float) y)
, ObjectAnimator.ofFloat(textViews.get(i), "alpha", 0, 1).setDuration(2000)
);
set.setInterpolator(new BounceInterpolator());
set.setDuration(500).setStartDelay(100);
set.start();
set.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
}
@Override
public void onAnimationEnd(Animator animation) {
//菜單狀態(tài)置打開(kāi)
isMenuOpen = true;
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
}
//轉(zhuǎn)動(dòng)加號(hào)大圖標(biāo)本身45°
ObjectAnimator rotate = ObjectAnimator.ofFloat(imgPublish, "rotation", 0, 90).setDuration(300);
rotate.setInterpolator(new BounceInterpolator());
rotate.start();
}
//關(guān)閉扇形菜單的屬性動(dòng)畫(huà)，參數(shù)與打開(kāi)時(shí)相反
private void showCloseAnim(int dp) {
//for循環(huán)來(lái)開(kāi)始小圖標(biāo)的出現(xiàn)動(dòng)畫(huà)
for (int i = 0; i < textViews.size(); i++) {
AnimatorSet set = new AnimatorSet();
double a = -Math.cos(20 * Math.PI / 180 * (i * 2 + 1));
double b = -Math.sin(20 * Math.PI / 180 * (i * 2 + 1));
double x = a * dip2px(dp);
double y = b * dip2px(dp);
set.playTogether(
ObjectAnimator.ofFloat(textViews.get(i), "translationX", (float) x, (float) (x * 0.25)),
ObjectAnimator.ofFloat(textViews.get(i), "translationY", (float) y, (float) (y * 0.25)),
ObjectAnimator.ofFloat(textViews.get(i), "alpha", 1, 0).setDuration(2000)
);
// set.setInterpolator(new AccelerateInterpolator());
set.setDuration(500);
set.start();
set.addListener(new Animator.AnimatorListener() {
@Override
public void onAnimationStart(Animator animation) {
}
@Override
public void onAnimationEnd(Animator animation) {
textView1.setVisibility(View.GONE);
textView2.setVisibility(View.GONE);
//菜單狀態(tài)置關(guān)閉
isMenuOpen = false;
}
@Override
public void onAnimationCancel(Animator animation) {
}
@Override
public void onAnimationRepeat(Animator animation) {
}
});
}
//轉(zhuǎn)動(dòng)加號(hào)大圖標(biāo)本身45°
ObjectAnimator rotate = ObjectAnimator.ofFloat(imgPublish, "rotation", 0, 90).setDuration(300);
rotate.setInterpolator(new BounceInterpolator());
rotate.start();
}
private int dip2px(int value) {
float density = getResources()
.getDisplayMetrics().density;
return (int) (density * value + 0.5f);
}
}
布局文件
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.lina.animationapplication.MainActivity">
<TextView
android:id="@+id/tv_1"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="40dp"
android:layout_marginRight="40dp"
android:gravity="center"
android:text="標(biāo)題1"
android:textColor="#ffffff"
android:visibility="gone"
android:background="@drawable/circle_purple"
/>
<TextView
android:id="@+id/tv_2"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="40dp"
android:layout_marginRight="40dp"
android:gravity="center"
android:text="標(biāo)題2"
android:textColor="#ffffff"
android:visibility="gone"
android:background="@drawable/circle_orange"/>
<ImageView
android:id="@+id/img_publish"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="bottom|end"
android:layout_marginBottom="35dp"
android:layout_marginRight="35dp"
android:src="@mipmap/fabu"
/>
</FrameLayout>
circle_purple.xml
<?xml version="1.0" encoding="utf-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <solid android:color="#5d2a89" /> </shape>
參考
Android開(kāi)罐頭———快速打造扇形衛(wèi)星菜單
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
您可能感興趣的文章:
- Android編程實(shí)現(xiàn)仿優(yōu)酷圓盤(pán)旋轉(zhuǎn)菜單效果的方法詳解【附demo源碼下載】
- Android自定義控件之仿優(yōu)酷菜單
- Android仿優(yōu)酷圓形菜單學(xué)習(xí)筆記分享
- Android編程實(shí)現(xiàn)仿優(yōu)酷旋轉(zhuǎn)菜單效果(附demo源碼)
- Android菜單(動(dòng)畫(huà)菜單、360波紋菜單)
- Android實(shí)現(xiàn)360手機(jī)助手底部的動(dòng)畫(huà)菜單
- Android程序開(kāi)發(fā)之使用Design包實(shí)現(xiàn)QQ動(dòng)畫(huà)側(cè)滑效果和滑動(dòng)菜單導(dǎo)航
- Android利用屬性動(dòng)畫(huà)實(shí)現(xiàn)優(yōu)酷菜單
相關(guān)文章
本文給大家詳細(xì)介紹了Android中常用的編譯命令、用法以及注意事項(xiàng)，非常的詳細(xì)，有需要的小伙伴可以參考下2016-03-03
Android UI設(shè)計(jì)與開(kāi)發(fā)之ViewPager介紹和簡(jiǎn)單實(shí)現(xiàn)引導(dǎo)界面
這篇文章主要為大家詳細(xì)介紹了Android UI設(shè)計(jì)與開(kāi)發(fā)之ViewPager介紹和簡(jiǎn)單實(shí)現(xiàn)引導(dǎo)界面，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-08-08
Android的Launcher啟動(dòng)器中添加快捷方式及小部件實(shí)例
這篇文章主要介紹了在Android的Launcher啟動(dòng)器中添加快捷方式及窗口小部件的方法,包括在自己的應(yīng)用程序中添加窗口小部件AppWidget的例子,需要的朋友可以參考下2016-02-02
這篇文章主要給大家介紹了關(guān)于Flutter如何保證數(shù)據(jù)操作原子性的相關(guān)資料,文章通過(guò)實(shí)例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2022-03-03
這篇文章主要為大家詳細(xì)介紹了Android仿qq消息拖拽效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2019-01-01
android自定義Toast設(shè)定顯示時(shí)間
這篇文章主要為大家詳細(xì)介紹了android自定義Toast設(shè)定顯示時(shí)間，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2018-08-08
Android 吸入動(dòng)畫(huà)效果實(shí)現(xiàn)分解
如何在Android上面實(shí)現(xiàn)一個(gè)類似的效果。先看看我實(shí)現(xiàn)的效果圖,我們利用了Canvas.drawBitmapMesh()方法，具體實(shí)現(xiàn)代碼如下，感興趣的朋友可以參考下哈2013-06-06
android中intent傳遞list或者對(duì)象的方法
這篇文章主要介紹了android中intent傳遞list或者對(duì)象的方法,分析羅列了常用的幾種方法,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-01-01
詳解如何使用Android Studio開(kāi)發(fā)Gradle插件
這篇文章主要介紹了詳解如何使用Android Studio開(kāi)發(fā)Gradle插件，小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-10-10
這篇文章主要為大家詳細(xì)介紹了ionic2如何處理android硬件返回按鈕，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-04-04