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

View Animation

Avatar for satsukies satsukies
October 02, 2017

View Animation

View Animation in Android

Avatar for satsukies

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();
 }
 }
 });