1. 程式人生 > >Android 3D 水平翻轉動畫實現

Android 3D 水平翻轉動畫實現

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#000000"
    android:orientation="vertical" >

    <!-- 標題部分 -->
    <RelativeLayout
android:id="@+id/title" android:layout_width="fill_parent" android:layout_height="50dip" android:background="#01aef0" android:orientation="horizontal" >
<Button android:id="@+id/btn_return" android:layout_width="50dip" android:layout_height
="50dip" android:layout_alignParentLeft="true" android:background="@null" />
<Button android:id="@+id/btn_music" android:layout_width="50dip" android:layout_height="50dip" android:layout_alignParentRight="true" android:background
="@drawable/music" />
<TextView android:id="@+id/text_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerHorizontal="true" android:layout_centerVertical="true" android:background="@android:color/transparent" android:text="@string/main_home" android:textColor="#ffffff" android:textSize="22sp" /> </RelativeLayout> <!-- 翻轉佈局的容器部分 --> <FrameLayout android:id="@+id/container_view" android:layout_width="fill_parent" android:layout_height="fill_parent" > <!-- 佈局2(音樂)部分 --> <LinearLayout android:id="@+id/lin2" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" android:background="#ccccff"> <ListView android:id="@+id/music_listview" android:layout_width="fill_parent" android:layout_height="wrap_content"> </ListView> </LinearLayout> <!-- 佈局1(首頁)部分 --> <LinearLayout android:id="@+id/lin1" android:layout_width="fill_parent" android:layout_height="fill_parent" android:background="#ccffff" android:gravity="center" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/main_home" android:textColor="#000000" android:textSize="36sp" /> </LinearLayout> </FrameLayout> </LinearLayout>

三、MainActivity.java檔案:

/**
 * 翻轉動畫切換Layout
 * @author qiulong
 * 
 */
public class MainActivity extends Activity implements OnClickListener {

	/** 初始檢視索引 (0為首頁,1為音樂) */
	private int index = 1;
	/** 標題文字 */
	private TextView text_title;
	/** 標題右邊按鈕 */
	private Button btn_music;
	/** 首頁檢視 */
	private LinearLayout homeView;
	/** 音樂檢視 */
	private LinearLayout musicView;
	/** 檢視容器 */
	private FrameLayout containerView;
	/** 音樂檢視List列表 */
	private ListView musicList;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		this.requestWindowFeature(Window.FEATURE_NO_TITLE);
		setContentView(R.layout.activity_main);

		text_title = (TextView) findViewById(R.id.text_title);
		btn_music = (Button) findViewById(R.id.btn_music);
		containerView = (FrameLayout) this.findViewById(R.id.container_view);
		homeView = (LinearLayout) findViewById(R.id.lin1);
		musicView = (LinearLayout) findViewById(R.id.lin2);
		musicList = (ListView) findViewById(R.id.music_listview);
		
		btn_music.setOnClickListener(this);
	}

	/**測試資料 */
	private List<String> getData() {
		List<String> data = new ArrayList<String>();
		data.add("音樂歌名1");
		data.add("音樂歌名2");
		data.add("音樂歌名3");
		data.add("音樂歌名4");
		data.add("音樂歌名5");
		data.add("音樂歌名6");
		data.add("音樂歌名7");
		data.add("音樂歌名8");
		data.add("音樂歌名9");
		data.add("音樂歌名10");
		return data;
	}
	
	@Override
	public void onClick(View v) {
		if (index == 1) {
			//首頁頁面以0~90度翻轉,並載入資料
			applyRotation(1, 0, 90);
			index = 0;
			musicList.setAdapter(new ArrayAdapter<String>(
					MainActivity.this,
					android.R.layout.simple_expandable_list_item_1,
					getData()));
		} else {
			//音樂頁面以0~-90度翻轉
			applyRotation(0, 0, -90);
			index = 1;
		}
	}

	/**
	 * 執行翻轉第一個檢視動畫
	 * @param tag view索引
	 * @param start 起始角度
	 * @param end 結束角度
	 */
	private void applyRotation(int tag, float start, float end) {
		// 得到中心點(以中心翻轉)
		final float centerX = containerView.getWidth() / 2.0f;
		final float centerY = containerView.getHeight() / 2.0f;
		// 根據引數建立一個新的三維動畫,並且監聽觸發下一個動畫
		final Rotate3d rotation = new Rotate3d(start, end, centerX, centerY,310.0f, true);
		rotation.setDuration(300);//設定動畫持續時間
		rotation.setInterpolator(new AccelerateInterpolator());//設定動畫變化速度
		rotation.setAnimationListener(new DisplayNextView(tag));//顯示下一個檢視
		containerView.startAnimation(rotation);
	}

	/**
	 * 顯示下一個檢視
	 * @author qiulong
	 * 
	 */
	private final class DisplayNextView implements Animation.AnimationListener {
		private final int tag;

		private DisplayNextView(int tag) {
			this.tag = tag;
		}

		public void onAnimationStart(Animation animation) {
		}

		public void onAnimationEnd(Animation animation) {
			containerView.post(new SwapViews(tag));
		}

		public void onAnimationRepeat(Animation animation) {
		}
	}

	/**
	 * 執行翻轉第二個檢視動畫子執行緒
	 * @author qiulong
	 * 
	 */
	private final class SwapViews implements Runnable {
		private final int tag;

		public SwapViews(int position) {
			tag = position;
		}

		public void run() {
			if (tag == 0) {
				text_title.setText("首頁");
				//首頁頁面以90~0度翻轉
				showView(tag,homeView, musicView, 90, 0);
			} else if (tag == 1) {
				text_title.setText("音樂");
				//音樂頁面以-90~0度翻轉
				showView(tag,musicView, homeView, -90, 0);
			}
		}
	}

	/**
	 * 顯示第二個檢視動畫
	 * @param showView 要顯示的檢視
	 * @param hiddenView 要隱藏的檢視
	 * @param start_jd 開始角度
	 * @param end_jd 目標角度
	 */
	private void showView(int tag, LinearLayout showView, LinearLayout hiddenView, int start_jd, int end_jd) {
		//同樣以中心點進行翻轉
		float centerX = showView.getWidth() / 2.0f;
		float centerY = showView.getHeight() / 2.0f;
		
            
           

相關推薦

Android 3D 水平翻轉動畫實現

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_pa

android:3D垂直翻轉動畫-FlipAnimation

lns sta art tco car flat 2015年 imp 聯盟 需求 對ImageView進行相似於翻紙牌的動畫 解決 各種Animator的組合 第一步動畫: 動畫代碼文件1,card_flip_left_out.xml

android Title滑塊動畫實現(適合新聞client多種欄目的展示)

back content this ani == div .get tostring rep 先上效果圖,選擇不同的模塊,滑動會通過動畫形式滑過去,這樣的適合新聞client多種欄目的展示: 這麽寫Layout: <RelativeLayout xmlns:

Android 3D立體旋轉效果實現

說明:之前在網上到處搜尋類似的旋轉效果 但搜到的結果都不是十分滿意 原因不多追述 (如果有人找到過相關 比較好的效果 可以發一下連線 一起共同進步)一 效果展示 :如非您所需要的效果 也希望能給些微幫助  具體操作以及實現 效果 請看專案例子二 使用方式此空間繼承與Frame

Android系統關機充電動畫實現

<span style="font-size:18px;color:#FF0000;">\mediatek\platform\mt6572\lk\mt_logo.c </span> /********** show_animationm_ver:

Android學習之Android 5.0分享動畫實現微信點選全屏效果

Android5.0過渡動畫,請看 今天用分享動畫實現微信點選全屏效果 本文原始碼下載地址 peizhi 配置 build.gradle: compile 'com.android.support:recyclerview-v7:23.

Android 3D畫廊採用Gallery實現無限迴圈、自動輪播

公司最近有一個需求,是打算做一個輪播圖的展示介面,不過和傳統意義上不同,並非是在手機app的頂部展示幾張定時切換的固定大小寬高的圖片,而是中間長方形,兩邊向裡傾斜,形成對稱感的特殊介面,如下圖: 需要實現功能:無限迴圈,自動跳轉,倒影效果。 (原本的企劃是動畫輪播的時候,

android初學------使用ScaleAnimation 動畫實現放大縮小效果

Animation.RELATIVE_TO_SELF 自身為中心放大 或縮小 //縮小 ScaleAnimation animation_suofang =new ScaleAnimatio

Android開發之Tween動畫實現方法

1,   Activity中實現 Animation的子類              Animation scaleAnimation = new ScaleAnimation(0f, 1f, 0f, 1f,             Animation.RELATIVE_

Android Reveal Animation(揭露動畫)實現

Android L (21)添加了揭露動畫,我們先來看一下效果圖: 看起來是不是蠻爽的~~ 接下來我們看一下怎麼實現這種效果把 首先我們新建一個Android專案,開啟對應的layout,寫成這樣: <?xml version="1.0"

Android ListView動畫實現方法

rri pan 自己 data- src def popu 動畫 onclick 在Android中listview是最經常使用的控件之中的一個,可是有時候我們會認為千篇一律的listview看起來過於單調,於是就產生了listView動畫,listview載入了動畫會

CSS3 3D翻轉動畫

strong ani size 坐標 animation 面向 ner face for CSS3動畫屬性:transform(變換):大小、位置、顏色、變形等狀態的變化transition(過渡):初始狀態過渡到結束狀態這個過程中產生的動畫animation(動畫):

CSS3中的3D動畫實現(鐘擺、魔方)--實現代碼

等待 比例 需要 時間 span bottom translate abs ase CSS3中的3D動畫實現(鐘擺、魔方) CSS3的2D變形----傳統的transform變形效果 transform : translate、scale、rotate、skew… tran

Android 7.1.1 之實現 3D Touch

轉載請註明出處:http://blog.csdn.net/yyh352091626/article/details/68962736 Shortcut概念 具體實現 Build

android中如何使用GPU實現硬體加速,3D渲染

已開通新的部落格,後續文字都會發到新部落格 http://www.0xfree.top --- 首先來看一些名詞解釋     GPU:Graphic  Processing Unit (圖形處理器)&nb

Android RecyclerView 詳解 RecyclerView的動畫實現(移除、新增、改變、移動)和自定義動畫實現

一丶新增刪除時候的重新整理問題 先上一下效果圖吧 1.為了方便起見我們還是先新增三個按鈕分別實現新增刪除和改變 2.在Adapter中寫呼叫方法並進行重新整理 public void remove(int position){ list.re

40行JavaScript程式碼實現3D旋轉魔方動畫效果

JS1K是JavaScript程式設計競賽——參加競賽的規則很簡單,指令碼必須小於1K,競賽網站開始也只是為了娛樂,卻意外地收到了很多優秀的作品。 這是2016年JS1k上傳的作品,用幾十行程

Android自定義View繪圖實現拖影動畫

前幾天在“Android繪圖之漸隱動畫”一文中通過畫線實現了漸隱動畫,但裡面有個問題,畫筆較粗(大於1)時線段之間會有裂隙,我又改進了一下。這次效果好多了。 先看效果吧: 然後我們來說說基本的做法: 根據畫筆寬度,計算每一條線段兩個頂點對應的四個點,

Android -- 自定義ViewGroup+貝塞爾+屬性動畫實現仿QQ點贊效果

private void init(final Context context) { mStarDrawable = new ArrayList<>(); mInterpolators = new ArrayList<>(); mSt

Android “+”號發散選單動畫實現--- pathMenu的實現思路

一,引言 最近有需求,需要開發類似淘寶“問大家”進去中間那個“+”號Tab,點選散發出兩個選單按鈕的動畫,大概效果如下: 然後點選“+”做發散動畫,效果大概如下 對於這樣子的動效是很多主流app都在做的,那麼我們應該怎麼做呢? 二