caoporm97国产在线视频|欧美性XXXXX精品|一本一道久久a久久精品综合开|精品久久久久久久久久久AⅤ|

十年專注于品牌網(wǎng)站建設(shè) 十余年專注于網(wǎng)站建設(shè)_小程序開發(fā)_APP開發(fā),低調(diào)、敢創(chuàng)新、有情懷!
南昌百恒網(wǎng)絡(luò)微信公眾號(hào) 掃一掃關(guān)注
小程序
tel-icon全國(guó)服務(wù)熱線:400-680-9298,0791-88117053
掃一掃關(guān)注百恒網(wǎng)絡(luò)微信公眾號(hào)
掃一掃打開百恒網(wǎng)絡(luò)微信小程序

百恒網(wǎng)絡(luò)

南昌百恒網(wǎng)絡(luò)

通過(guò)shared element transition實(shí)現(xiàn)同種元素視圖間的切換效果

百恒網(wǎng)絡(luò) 2017-08-18 7779

南昌APP開發(fā)中,shared element transition(又稱為hero transition)是material design中引入的另一新動(dòng)畫特效。 它適用于一種特殊場(chǎng)景:兩個(gè)待切換視圖顯示同樣一些元素。 這是一種常見的交互模式:點(diǎn)擊一個(gè)元素,彈出新的視圖顯示元素明細(xì)。

對(duì)于兩個(gè)展示相同元素的視圖,其間的任何動(dòng)畫切換場(chǎng)景都可以使用shared element transition 來(lái)實(shí)現(xiàn)。圖1中,右邊的大圖片和左邊的小圖片是同一張圖。這張圖就是個(gè)shared element。

放大版照片視圖

圖1 放大版照片視圖

在Lollipop中,Android有辦法實(shí)現(xiàn)activity或fragment間的動(dòng)畫切換。圖2是動(dòng)畫過(guò)程中的一副截圖,可大致看出實(shí)現(xiàn)效果?,F(xiàn)在南昌APP制作開發(fā)公司小編就來(lái)帶大家看一看如何把這種動(dòng)畫應(yīng)用于activity。

shared element的變換

圖2 shared element的變換

實(shí)現(xiàn)activity間的動(dòng)畫切換涉及以下三個(gè)步驟:

1、打開activity transition;

2、為每個(gè)shared element視圖設(shè)置transition名值;

3、啟動(dòng)帶ActivityOptions(觸發(fā)動(dòng)畫)的activity。

首先是打開activity transition。如果你的activity使用了AppCompat主題,這個(gè)步驟可以直接跳過(guò)。(AppCompat繼承Material主題,會(huì)自動(dòng)為你打開activity transition。)

在CriminalIntent的例子中,為了讓目標(biāo)activity擁有透明背景,我們使用了@android:style/ Theme.Translucent.NoTitleBar主題樣式。這個(gè)主題沒有繼承Material主題,所以需要手工打開activity transition。有兩種方式可以打開activity transition,先來(lái)看如何用代碼打開它。

以代碼的方式打開activity transition

@Override

public void onCreate(Bundle savedInstanceState) {

getWindow().requestFeature(Window.FEATURE_ACTIVITY_TRANSITIONS);

super.onCreate(savedInstanceState);

...

}

另外一種方式是修改activity的樣式,設(shè)置android:windowActivityTransitions屬性值為 true。

在樣式里打開activity transition


再來(lái)看如何為shared element視圖設(shè)置transition名值。Android在API 21中為View引入了 transitionName屬性。所以,可以在布局或代碼中設(shè)置這個(gè)屬性值。兩種方式各有其適用的場(chǎng)景,具體問(wèn)題具體分析。本例中,我們?cè)诓季諼ML文件里,將android:transitionName屬性設(shè) 置為image,如圖3所示。


圖3 設(shè)置android:transitionName屬性值為image

然后,再定義一個(gè)startWithTransition(...)靜態(tài)方法,為視圖設(shè)置transition名稱,如下代碼1所示。

定義startWithTransition(...)方法

public static void startWithTransition(Activity activity, Intent intent,

View sourceView) {

ViewCompat.setTransitionName(sourceView, "image");

ActivityOptionsCompat options = ActivityOptionsCompat

.makeSceneTransitionAnimation(activity, sourceView, "image");

activity.startActivity(intent, options.toBundle());

}

Android舊版本系統(tǒng)中,View視圖沒有setTransitionName(String)屬性方法。所以,需要使用ViewCompat.setTransitionName(View, String)方法設(shè)置TransitionName。 在代碼清單1中,作為三個(gè)步驟的后一步,我們使用ActivityOptions對(duì)象,讓操作系統(tǒng)知道shared element是什么,以及使用哪個(gè)transitionName值。

當(dāng)然,transition和shared element transition能做的遠(yuǎn)不止這些。例如,它們還可以用于fragment間的動(dòng)畫切換。這里就不多做說(shuō)明了,想了解更多關(guān)于南昌APP開發(fā)方面的相關(guān)技術(shù),歡迎訪問(wèn)百恒網(wǎng)絡(luò)網(wǎng)站,更多相關(guān)專業(yè)技術(shù)知識(shí)與您分享,相信您一定會(huì)有收獲!


400-680-9298,0791-88117053
掃一掃關(guān)注百恒網(wǎng)絡(luò)微信公眾號(hào)
掃一掃打開百恒網(wǎng)絡(luò)小程序

歡迎您的光顧,我們將竭誠(chéng)為您服務(wù)×

售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售前咨詢 售前咨詢
 
售后服務(wù) 售后服務(wù)
 
售后服務(wù) 售后服務(wù)
 
備案專線 備案專線
 
×