Android如何實(shí)現(xiàn)翻轉(zhuǎn)動(dòng)畫效果（卡片翻轉(zhuǎn)）
更新時(shí)間：2021年08月11日 11:10:04 作者：計(jì)蒙不吃魚
卡片翻轉(zhuǎn)這個(gè)效果大家應(yīng)該都不陌生,這篇文章主要給大家介紹了關(guān)于Android如何實(shí)現(xiàn)翻轉(zhuǎn)動(dòng)畫效果的相關(guān)資料,文中將實(shí)現(xiàn)的源代碼以及過(guò)程中遇到的bug都介紹的非常詳細(xì),需要的朋友可以參考下
前言
最近好友問(wèn)計(jì)蒙翻轉(zhuǎn)動(dòng)畫，恰好在大二那年看Android Api Demo時(shí)記了筆記，由此寫一篇文章。
需求
屏幕右滑事件觸發(fā)卡片的翻轉(zhuǎn)效果 ，為了方便，在例子中將右滑事件改成按鈕點(diǎn)擊事件
老規(guī)矩，最后有源碼
一、先介紹三個(gè)插值器
- LinearInterpolator() 其變化速率恒定
- AccelerateInterpolator() 其變化開始速率較慢，后面加速
- DecelerateInterpolator() 其變化開始速率較快，后面減速
二、實(shí)現(xiàn)步驟
1.效果圖
2.布局
一個(gè)按鈕，兩個(gè)TextView（布局文件在源碼部分）
3.邏輯判斷（是否隱藏）
final TextView visibletext;
final TextView invisibletext;
//邏輯判斷
if (textview1.getVisibility() == View.GONE) {
visibletext = textview2;
invisibletext = textview1;
} else {
invisibletext = textview2;
visibletext = textview1;
}
4.翻轉(zhuǎn)動(dòng)畫
//LinearInterpolator() 其變化速率恒定
ObjectAnimator visToInvis = ObjectAnimator.ofFloat(visibletext, "rotationY", 0f, 90f);
visToInvis.setDuration(500);
//AccelerateInterpolator() 其變化開始速率較慢，后面加速
visToInvis.setInterpolator(new AccelerateInterpolator());
final ObjectAnimator invisToVis = ObjectAnimator.ofFloat(invisibletext, "rotationY",
-90f, 0f);
invisToVis.setDuration(500);
//DecelerateInterpolator() 其變化開始速率較快，后面減速
invisToVis.setInterpolator(new DecelerateInterpolator());
visToInvis.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator anim) {
visibletext.setVisibility(View.GONE);
invisToVis.start();
invisibletext.setVisibility(View.VISIBLE);
}
});
visToInvis.start();
5.bug出現(xiàn)
發(fā)現(xiàn)實(shí)現(xiàn)后，第一次點(diǎn)擊出現(xiàn)bug
6.bug解決
在找到控件后，默認(rèn)設(shè)置y方向角度
textview2.setRotationY(-90f);
三、源碼
MainActivity.java
public class MainActivity extends Activity {
private TextView textview1;
private TextView textview2;
private Button button;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
//bug解決
textview2.setRotationY(-90f);
button.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
flipAnimation();
}
});
}
private void initView() {
textview1 = (TextView) findViewById(R.id.textview1);
textview2 = (TextView) findViewById(R.id.textview2);
button = (Button) findViewById(R.id.button);
}
private void flipAnimation() {
final TextView visibletext;
final TextView invisibletext;
//邏輯判斷
if (textview1.getVisibility() == View.GONE) {
visibletext = textview2;
invisibletext = textview1;
} else {
invisibletext = textview2;
visibletext = textview1;
}
//LinearInterpolator() 其變化速率恒定
ObjectAnimator visToInvis = ObjectAnimator.ofFloat(visibletext, "rotationY", 0f, 90f);
visToInvis.setDuration(500);
//AccelerateInterpolator() 其變化開始速率較慢，后面加速
visToInvis.setInterpolator(new AccelerateInterpolator());
final ObjectAnimator invisToVis = ObjectAnimator.ofFloat(invisibletext, "rotationY",
-90f, 0f);
invisToVis.setDuration(500);
//DecelerateInterpolator() 其變化開始速率較快，后面減速
invisToVis.setInterpolator(new DecelerateInterpolator());
visToInvis.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator anim) {
visibletext.setVisibility(View.GONE);
invisToVis.start();
invisibletext.setVisibility(View.VISIBLE);
}
});
visToInvis.start();
}
}
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:background="#35B9F4"
android:id="@+id/textview1"
android:layout_centerInParent="true"
/>
<TextView
android:layout_width="200dp"
android:layout_height="200dp"
android:background="#03DAC5"
android:layout_centerInParent="true"
android:id="@+id/textview2"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:id="@+id/button"
android:text="點(diǎn)擊翻轉(zhuǎn)"/>
</RelativeLayout>
四、總結(jié)
最后將button的點(diǎn)擊事件改成屏幕監(jiān)聽事件即可。
到此這篇關(guān)于Android如何實(shí)現(xiàn)翻轉(zhuǎn)動(dòng)畫效果的文章就介紹到這了,更多相關(guān)Android實(shí)現(xiàn)翻轉(zhuǎn)動(dòng)畫內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
您可能感興趣的文章:
- Android 矢量室內(nèi)地圖開發(fā)實(shí)例
- Android中Activity過(guò)渡動(dòng)畫的實(shí)例講解
- Android activity動(dòng)畫不生效原因及解決方案總結(jié)
- Android 幀動(dòng)畫使用詳情
- Android動(dòng)畫之TranslateAnimation用法案例詳解
- Android實(shí)現(xiàn)簡(jiǎn)單點(diǎn)贊動(dòng)畫
- Android實(shí)現(xiàn)雅虎新聞?wù)虞d視差動(dòng)畫效果
- Android實(shí)現(xiàn)旋轉(zhuǎn)動(dòng)畫的兩種方式案例詳解
- Android高級(jí)動(dòng)畫篇之SVG矢量動(dòng)畫范例
相關(guān)文章
fastboot 是作為 Android 系統(tǒng)編譯器的客戶端,編譯后位于 ./out/host/?Linux?-x86/bin/fastboot 目錄下,這篇文章主要介紹了Android燒錄指令fastboot簡(jiǎn)介,需要的朋友可以參考下2024-01-01
這篇文章主要為大家詳細(xì)介紹了Android實(shí)現(xiàn)商品展示效果，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
使用Android WebSocket實(shí)現(xiàn)即時(shí)通訊功能
即時(shí)通訊（Instant Messaging）最重要的毫無(wú)疑問(wèn)就是即時(shí)，不能有明顯的延遲，要實(shí)現(xiàn)IM的功能其實(shí)并不難，目前有很多第三方，比如極光的JMessage，都比較容易實(shí)現(xiàn)。本文通過(guò)實(shí)例代碼給大家分享Android WebSocket實(shí)現(xiàn)即時(shí)通訊功能，一起看看吧2019-10-10
Android開發(fā)之ViewFlipper自動(dòng)播放圖片功能實(shí)現(xiàn)方法示例
這篇文章主要介紹了Android開發(fā)之ViewFlipper自動(dòng)播放圖片功能實(shí)現(xiàn)方法,結(jié)合實(shí)例形式分析了Android使用ViewFlipper實(shí)現(xiàn)圖片播放的相關(guān)界面布局及功能實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-03-03
這篇文章主要將從源碼的角度帶大家一起分析Android?rinflate的使用，文中的示例代碼講解詳細(xì)，具有一定的學(xué)習(xí)價(jià)值，感興趣的可以了解一下2023-04-04
Android使用LinearLayout設(shè)置邊框
這篇文章主要介紹了Android如何使用LinearLayout設(shè)置邊框，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-09-09
TextView類似一般UI中的Label,TextBlock等控件，只是為了單純的顯示一行或多行文本,本文介紹了Android中文本控件TextView的用法和常用屬性的用法2012-11-11
android?studio數(shù)據(jù)存儲(chǔ)建立SQLite數(shù)據(jù)庫(kù)實(shí)現(xiàn)增刪查改
這篇文章主要介紹了vandroid?studio數(shù)據(jù)存儲(chǔ)建立SQLite數(shù)據(jù)庫(kù)實(shí)現(xiàn)增刪查改，分別使用sqlite3工具和Android代碼的方式建立SQLite數(shù)據(jù)庫(kù)，具體內(nèi)容，需要的小伙伴可以參考下面文章得詳細(xì)內(nèi)容2021-12-12
AndroidManifest.xml是每個(gè)android程序中必須的文件。它位于整個(gè)項(xiàng)目的根目錄，描述了package中暴露的組件(activities,services,等等),他們各自的實(shí)現(xiàn)類，各種能被處理的數(shù)據(jù)和啟動(dòng)位置2013-05-05
Android自定義View實(shí)現(xiàn)仿1號(hào)店垂直滾動(dòng)廣告條代碼
這篇文章主要介紹了Android自定義View實(shí)現(xiàn)仿1號(hào)店垂直滾動(dòng)廣告條代碼，實(shí)現(xiàn)步驟及實(shí)現(xiàn)原理本文給大家介紹的非常詳細(xì)，需要的朋友參考下吧2017-01-01