1. 程式人生 > >Android 共享元素簡單使用

Android 共享元素簡單使用

Android5.0提供了一種叫做:共享元素。實現,轉場時介面如絲般順滑的過渡.學習記錄一下。
展示效果如圖 從活動A過渡到活動B

2.實現程式碼
關鍵在於將要共享的元素的android:transitionName屬性設定相同,
這裡設定為android:transitionName=“sharedimg”
活動A的佈局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:layout_gravity="center"
    android:gravity="center">

    <android.support.v7.widget.CardView
        android:layout_gravity="center"
        android:layout_width="250dp"
        android:layout_height="250dp"
        app:cardBackgroundColor="#efefef"
        >
        <ImageView
            android:id="@+id/img"
            android:layout_gravity="top|center"
            android:layout_width="200dp"
            android:layout_height="200dp"
            android:src="@drawable/test"
            android:transitionName="sharedimg"/>
        <TextView
            android:id="@+id/txt"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|center"
            android:layout_marginBottom="10dp"
            android:textSize="25sp"
            android:text="朝霞美如你"/>
    </android.support.v7.widget.CardView>

</LinearLayout>

活動B佈局

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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=".Main2Activity"
    android:layout_gravity="center"
    android:gravity="center"
    android:orientation="vertical">


        <ImageView
            android:layout_width="match_parent"
            android:layout_height="400dp"
            android:layout_margin="20dp"
            android:src="@drawable/test"
            android:transitionName="sharedimg"/>
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:textSize="25sp"
            android:text="然而卻不及你美。"/>

</LinearLayout>

活動A中的啟動程式碼
監聽圖片點選

package com.example.a37443.sharedelement;

import android.app.ActivityOptions;
import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Pair;
import android.view.View;
import android.widget.ImageView;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

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

        final ImageView img = (ImageView)findViewById(R.id.img);
        img.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent intent = new Intent(MainActivity.this,Main2Activity.class);
                ActivityOptions options = ActivityOptions.makeSceneTransitionAnimation(MainActivity.this,img,"sharedimg");
                startActivity(intent,options.toBundle());
            }
        });
    }
}

OK,到此就實現了簡單共享元素跳轉了。