Upgrade to Pro — share decks privately, control downloads, hide ads and more …

View Animation

satsukies
October 02, 2017

View Animation

View Animation in Android

satsukies

October 02, 2017
Tweet

More Decks by satsukies

Other Decks in Programming

Transcript

  1. "OJNBUJPO 7JFX"OJNBUJPO 1SPQFSUZ"OJNBUJPO %SBXBCMF"OJNBUJPO BMQIB SPUBUF TDBMF USBOTMBUF ࢖͍΍͍͢ɾ؆୯ ݟͨ໨͚͕ͩมԽ͢ΔΞχϝʔγϣϯ

    // viewͷalpha஋͕0͔Β1΁3ඵ͔͚ͯมԽ͢ΔΞχϝʔγϣϯ
 (findViewById(R.id.image_view) as? ImageView)?.apply {
 startAnimation(AlphaAnimation(0f, 1f).apply {
 duration = 3000
 })
 }
  2. "OJNBUJPO 7JFX"OJNBUJPO 1SPQFSUZ"OJNBUJPO "1*͔Β࣮૷͞Εͨ৽͍͠BOJNBUPS ෳࡶͳΞχϝʔγϣϯΛදݱՄೳ ݟͨ໨͚ͩͰͳ࣮͘ࡍͷҐஔ΋มԽ <set xmlns:android="http://schemas.android.com/apk/res/android"
 android:ordering=“together">
 <objectAnimator


    android:duration="3000"
 android:propertyName=“alpha"
 android:valueFrom="0f"
 android:valueTo="1f"/>
 <objectAnimator
 android:duration="3000"
 android:propertyName="translationY"
 android:valueFrom="0dp"
 android:valueTo="100dp"/>
 </set> %SBXBCMF"OJNBUJPO
  3. "OJNBUJPO 1SPQFSUZ"OJNBUJPO %SBXBCMF"OJNBUJPO ը૾ϦιʔεΛෳ਺ຕར༻ͯ͠ ύϥύϥອըͷΑ͏ʹ࠶ੜͤ͞Δ 7JFX"OJNBUJPO <?xml version="1.0" encoding="utf-8"?>
 <animation-list

    xmlns:android="http://schemas.android.com/apk/res/android"
 android:oneshot="false"
 android:visible="true" >
 
 <item android:drawable=“@drawable/pict0" android:duration="300" />
 <item android:drawable="@drawable/pict1" android:duration="300" />
 <item android:drawable="@drawable/pict2" android:duration="300" />
 <item android:drawable="@drawable/pict3" android:duration="300" />
 <item android:drawable="@drawable/pict4" android:duration="300" />
 
 </animation-list>
  4. .BUFSJBM%FTJHO w .BUFSJBMJTUIFNFUBQIPS w #PME HSBQIJD JOUFOUJPOBM w .PUJPOQSPWJEFTNFBOJOH ҙຯͷ͋Δಈ͖ΛϢʔβʹࣔ͢͜ͱͰ

    ɾࢹ֮తʹ஫ҙΛҾ͖͚ͭΔ ɾཁૉͷग़ݱ΍มܗɺҠಈΛ௨ͯ͡࿈ଓੑΛ఻͑Δ ը໘ભҠ͕࣌࠷΋࿈ଓੑ͕ࣦΘΕ΍ͦ͢͏
  5. #BTJDJNQMFNFOU /PSNBM.BTUFS"DUJWJUZLU val intent = Intent(context, SharedMasterActivity::class.java)
 val optionsCompat =

    ActivityOptionsCompat.makeSceneTransitionAnimation( this, targetView,
 targetView.transitionName) startActivity(intent, optionsCompat.toBundle()) Ξχϝʔγϣϯର৅ͷWJFX //viewͷΠϯελϯεϝιου targetView.setTransitionName("hogehoge") //ViewCompatΫϥεͷΫϥεϝιου ViewCompat.setTransitionName(targetView, "hogehoge") android:transitionName="hogehoge"
  6. "EWBODFEJNQMFNFOU override fun onCreate(savedInstanceState: Bundle?) {
 super.onCreate(savedInstanceState) supportPostponeEnterTransition() // Ξχϝʔγϣϯ཈ࢭ

    ~~~~~~~~~~~~~~~ fun startEnterTransition() {
 if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) return
 
 supportStartPostponedEnterTransition(); // Ξχϝʔγϣϯ࠶։
 }
  7. "EWBODFEJNQMFNFOU (MJEF΍1JDBTTPͷ$BMMCBDLʹ࢓ࠐΜͰΈΔ ImageView targetImageView = (ImageView)findViewById(R.id.image_header); //Glideͷ৔߹(4.0-RC0) Glide.with(this) .load("http://hogehoge.com/fugafuga") .listener(new

    RequestListener() { @Override public boolean onResourceReady(Object resource, Object model, Target target, DataSource dataSource, boolean isFirstResource) { startPostponedEnterTransition() return false; } }) .into(targetImageView); //Picassoͷ৔߹ Picasso.with(this) .load("http://hogehoge.com/fugafuga").into(targetImageView, new Callback(){ @Override public void onSuccess() { startPostponedEnterTransition() } });
  8. 5SBOTJUJPOXJUIUIVNC ᶃ*OUFOUʹΩϟογϡࡁΈը૾ͷ63-Λ৐ͤΔ ᶄαϜωΠϧಡΈࠐΈʹ*OUFOUͷ63-Λ࢖͏ binding.getRoot().setOnClickListener(v -> episodeSelectListener.action( ep, ep.getEpisodeListThumbnail().with(options).url(), // ΩϟογϡࡁΈͷը૾URL


    binding.episodeThumbnail, binding.vdSeriesThumbnailFreeMark,
 binding.episodePlayMark)); ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ Intent intent = new Intent(this, DstActivity.class); intent.putExtra(“extra_url”, thumbnailUrlString);
  9. 5SBOTJUJPOXJUIUIVNC ᶃ*OUFOUʹΩϟογϡࡁΈը૾ͷ63-Λ৐ͤΔ ᶄαϜωΠϧಡΈࠐΈʹ*OUFOUͷ63-Λ࢖͏ //͢ͰʹMasterActivityͰऔಘࡁΈͰ͋Ζ͏ը૾ΛαϜωΠϧͱͯ͠ར༻͢Δ .thumbnail( Glide.with(imageView.getContext()) .load(imageThumbURL) .listener(new RequestListener<Drawable>() {

    @Override public boolean onLoadFailed(@Nullable GlideException e, Object model, Target<Drawable> target, boolean isFirstResource) return false; }
 
 @Override public boolean onResourceReady(Drawable resource, Object model, Target<Drawable> target, DataSource dataSource, boolean isFirstResource) { supportStartPostponedEnterTransition(); // ಡΈࠐΈ׬ྃͰΞχϝʔγϣϯ࣮ߦ
 return false; }}) .apply(new RequestOptions().skipMemoryCache(true)
 .diskCacheStrategy(DiskCacheStrategy.AUTOMATIC)))
 .into(imageView);
  10. ͦͷଞ5JQT TUBUVTOBWJHBUJPOCBSʹඃͤͳ͍ εςʔλεόʔ΍φϏήʔγϣϯόʔ΋ 4IBSFE&MFNFOU5SBOTJUJPOʹؚΊΔ // navigation bar View nav =

    findViewById(android.R.id.navigationBarBackground); // status bar View stat = findViewById(android.R.id.statusBarBackground);
 Pair<View, String> navPair = new Pair<>(nav, "nav");
 Pair<View, String> statPair = new Pair<>(stat, "stat");
 
 ActivityOptionsCompat.makeSceneTransitionAnimation(this, navPair, statPair); WJFX͕ݟ੾ΕͯͨΒΞχϝʔγϣϯ͠ͳ͍
  11. ͦͷଞ5JQT TUBUVTOBWJHBUJPOCBSʹඃͤͳ͍ ಈతͳΞχϝʔγϣϯ࣮ߦՄ൱ͷ੍ޚ 4IBSFE&MFNFOU$BMMCBDLͰ ΞχϝʔγϣϯͷΩϟϯηϧॲཧΛ࣮૷ setEnterSharedElementCallback(new SharedElementCallback() {
 @Override
 public

    void onMapSharedElements(List<String> names, Map<String, View> sharedElements) {
 // Ξχϝʔγϣϯର৅view͕ݟ੾Ε͍ͯΔ৔߹͸ΞχϝʔγϣϯΛ࣮ߦ͠ͳ͍
 shouldClearSharedElements |= !Stream.of(sharedElements)
 .filter(item -> item.getValue() != null)
 .allMatch(item -> viewBehavior.checkViewContains(item.getValue()));
 
 if (shouldClearSharedElements) {
 names.clear();
 sharedElements.clear();
 }
 }
 });