Bir görünümü animasyon kullanarak açığa çıkarma veya gizleme

"Oluştur" yöntemini deneyin

Jetpack Compose, Android için önerilen kullanıcı arayüzü araç setidir. Oluşturma'da Animasyonları nasıl kullanacağınızı öğrenin.

Çapraz geçiş →

Uygulamanız kullanılırken ekranda yeni bilgiler görünür ve eski bilgiler kaldırılır. Ekranda gösterilen içeriği hemen değiştirmek rahatsız edici olabilir ve kullanıcılar aniden görünen yeni içeriği gözden kaçırabilir. Animasyonlar değişiklikleri yavaşlatır ve kullanıcıların dikkatini hareketle çeker. Böylece güncellemeler daha belirgin olur.

Bir görünümü göstermek veya gizlemek için kullanabileceğiniz üç yaygın animasyon vardır: görünen animasyonlar, geçişli animasyonlar ve kart çevirme animasyonları.

Çapraz geçiş animasyonu oluşturma

Kaybolma olarak da bilinen çapraz geçiş animasyonları, bir View veya ViewGroup yavaş yavaş yavaşça gözden kaybolurken aynı anda diğerinde de soluklaşır. Bu animasyon, uygulamanızdaki içerikleri veya görünümleri değiştirmek istediğiniz durumlarda kullanışlıdır. Burada gösterilen çapraz geçiş animasyonu, Android 3.1 (API düzeyi 12) ve sonraki sürümlerde kullanılabilen ViewPropertyAnimator animasyonunu kullanır.

İlerleme göstergesinden metin içeriğine geçişe bir örnek aşağıda verilmiştir:

Görünümleri oluşturma

Çapraz geçişini yapmak istediğiniz iki görünümü oluşturun. Aşağıdaki örnekte bir ilerleme göstergesi ve kaydırılabilir metin görünümü oluşturulur:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/content"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <TextView style="?android:textAppearanceMedium"
            android:lineSpacingMultiplier="1.2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:text="@string/lorem_ipsum"
            android:padding="16dp" />

    </ScrollView>

    <ProgressBar android:id="@+id/loading_spinner"
        style="?android:progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center" />

</FrameLayout>

Çapraz geçiş animasyonunu ayarlama

Çapraz geçiş animasyonunu ayarlamak için aşağıdakileri yapın:

1. Geçiş yapmak istediğiniz görünümler için üye değişkenleri oluşturun. Daha sonra animasyon sırasında görünümleri değiştirirken bu referanslara ihtiyacınız olur.
2. Karartılan görünümün görünürlüğünü GONE olarak ayarlayın. Böylece, görünüm, düzen alanını kullanmasını engeller ve düzen hesaplamalarından atlayarak işlemeyi hızlandırır
3. config_shortAnimTime sistem özelliğini bir üye değişkeninde önbelleğe alın. Bu özellik, animasyon için standart bir "kısa" süre tanımlar. Bu süre, sık gerçekleşen hafif animasyonlar veya animasyonlar için idealdir. config_longAnimTime ve config_mediumAnimTime da mevcuttur.

Aşağıda, önceki kod snippet'indeki düzeni etkinlik içerik görünümü olarak kullanan bir örnek verilmiştir:

class CrossfadeActivity : Activity() {

    private lateinit var contentView: View
    private lateinit var loadingView: View
    private var shortAnimationDuration: Int = 0
    ...
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_crossfade)

        contentView = findViewById(R.id.content)
        loadingView = findViewById(R.id.loading_spinner)

        // Initially hide the content view.
        contentView.visibility = View.GONE

        // Retrieve and cache the system's default "short" animation time.
        shortAnimationDuration = resources.getInteger(android.R.integer.config_shortAnimTime)
    }
    ...
}

public class CrossfadeActivity extends Activity {

    private View contentView;
    private View loadingView;
    private int shortAnimationDuration;
    ...
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_crossfade);

        contentView = findViewById(R.id.content);
        loadingView = findViewById(R.id.loading_spinner);

        // Initially hide the content view.
        contentView.setVisibility(View.GONE);

        // Retrieve and cache the system's default "short" animation time.
        shortAnimationDuration = getResources().getInteger(
                android.R.integer.config_shortAnimTime);
    }
    ...
}

Görünümleri çaprazla tanıştırın

Görünümler uygun şekilde ayarlandığında, aşağıdakileri yaparak bunların çapraz geçişini yapın:

1. Azalan görünüm için alfa değerini 0, görünürlüğü ise ilk GONE ayarından itibaren VISIBLE olarak ayarlayın. Bu, görünümü görünür ancak şeffaf hale getirir.
2. Azalan görünüm için alfa değerini 0'dan 1'e taşıyın. Kararan görünüm için alfa değerini 1'den 0'a taşıyın.
3. Animator.AnimatorListener içinde onAnimationEnd() kullanarak kararan görünümün görünürlüğünü GONE olarak ayarlayın. Alfa değeri 0 olsa da, görünümün görünürlüğünü GONE olarak ayarlamak görünümün düzen alanını kullanmasını engeller ve düzen hesaplamalarına dahil edilmez. Bu da işlemeyi hızlandırır.

Aşağıdaki yöntemde bunun nasıl yapılacağına dair bir örnek gösterilmektedir:

class CrossfadeActivity : Activity() {

    private lateinit var contentView: View
    private lateinit var loadingView: View
    private var shortAnimationDuration: Int = 0
    ...
    private fun crossfade() {
        contentView.apply {
            // Set the content view to 0% opacity but visible, so that it is
            // visible but fully transparent during the animation.
            alpha = 0f
            visibility = View.VISIBLE

            // Animate the content view to 100% opacity and clear any animation
            // listener set on the view.
            animate()
                    .alpha(1f)
                    .setDuration(shortAnimationDuration.toLong())
                    .setListener(null)
        }
        // Animate the loading view to 0% opacity. After the animation ends,
        // set its visibility to GONE as an optimization step so it doesn't
        // participate in layout passes.
        loadingView.animate()
                .alpha(0f)
                .setDuration(shortAnimationDuration.toLong())
                .setListener(object : AnimatorListenerAdapter() {
                    override fun onAnimationEnd(animation: Animator) {
                        loadingView.visibility = View.GONE
                    }
                })
    }
}

public class CrossfadeActivity extends Activity {

    private View contentView;
    private View loadingView;
    private int shortAnimationDuration;
    ...
    private void crossfade() {

        // Set the content view to 0% opacity but visible, so that it is
        // visible but fully transparent during the animation.
        contentView.setAlpha(0f);
        contentView.setVisibility(View.VISIBLE);

        // Animate the content view to 100% opacity and clear any animation
        // listener set on the view.
        contentView.animate()
                .alpha(1f)
                .setDuration(shortAnimationDuration)
                .setListener(null);

        // Animate the loading view to 0% opacity. After the animation ends,
        // set its visibility to GONE as an optimization step so it doesn't
        // participate in layout passes.
        loadingView.animate()
                .alpha(0f)
                .setDuration(shortAnimationDuration)
                .setListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        loadingView.setVisibility(View.GONE);
                    }
                });
    }
}

Kart çevirme animasyonu oluşturma

Kart, ters çevrilen bir kartın emülasyonunu gösteren bir animasyon göstererek içerik görünümleri arasında geçiş yapar. Burada gösterilen kart çevirme animasyonu FragmentTransaction kullanıyor.

Kart çevirme işlemi aşağıdaki gibi görünür:

Animatör nesnelerini oluşturma

Kart çevirme animasyonunu oluşturmak için dört animatöre ihtiyacınız var. Kartın ön yüzünün dışarı ve sola hareket etmesi ve kartın içeri ve soldan hareket etmesi için iki animasyon kullanılır. Diğer iki animatör, kartın arka tarafının sağdan içeri ve sağa doğru hareket ettiği ve dışarıdaki ve sağa doğru hareket ettiği zamandır.

card_flip_left_in.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Before rotating, immediately set the alpha to 0. -->
    <objectAnimator
        android:valueFrom="1.0"
        android:valueTo="0.0"
        android:propertyName="alpha"
        android:duration="0" />

    <!-- Rotate. -->
    <objectAnimator
        android:valueFrom="-180"
        android:valueTo="0"
        android:propertyName="rotationY"
        android:interpolator="@android:interpolator/accelerate_decelerate"
        android:duration="@integer/card_flip_time_full" />

    <!-- Halfway through the rotation, set the alpha to 1. See startOffset. -->
    <objectAnimator
        android:valueFrom="0.0"
        android:valueTo="1.0"
        android:propertyName="alpha"
        android:startOffset="@integer/card_flip_time_half"
        android:duration="1" />
</set>

card_flip_left_out.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Rotate. -->
    <objectAnimator
        android:valueFrom="0"
        android:valueTo="180"
        android:propertyName="rotationY"
        android:interpolator="@android:interpolator/accelerate_decelerate"
        android:duration="@integer/card_flip_time_full" />

    <!-- Halfway through the rotation, set the alpha to 0. See startOffset. -->
    <objectAnimator
        android:valueFrom="1.0"
        android:valueTo="0.0"
        android:propertyName="alpha"
        android:startOffset="@integer/card_flip_time_half"
        android:duration="1" />
</set>

card_flip_right_in.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Before rotating, immediately set the alpha to 0. -->
    <objectAnimator
        android:valueFrom="1.0"
        android:valueTo="0.0"
        android:propertyName="alpha"
        android:duration="0" />

    <!-- Rotate. -->
    <objectAnimator
        android:valueFrom="180"
        android:valueTo="0"
        android:propertyName="rotationY"
        android:interpolator="@android:interpolator/accelerate_decelerate"
        android:duration="@integer/card_flip_time_full" />

    <!-- Halfway through the rotation, set the alpha to 1. See startOffset. -->
    <objectAnimator
        android:valueFrom="0.0"
        android:valueTo="1.0"
        android:propertyName="alpha"
        android:startOffset="@integer/card_flip_time_half"
        android:duration="1" />
</set>

card_flip_right_out.xml

<set xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- Rotate. -->
    <objectAnimator
        android:valueFrom="0"
        android:valueTo="-180"
        android:propertyName="rotationY"
        android:interpolator="@android:interpolator/accelerate_decelerate"
        android:duration="@integer/card_flip_time_full" />

    <!-- Halfway through the rotation, set the alpha to 0. See startOffset. -->
    <objectAnimator
        android:valueFrom="1.0"
        android:valueTo="0.0"
        android:propertyName="alpha"
        android:startOffset="@integer/card_flip_time_half"
        android:duration="1" />
</set>

Görünümleri oluşturma

Kartın her iki tarafı da iki metin görünümü, iki resim veya aralarında geçiş yapabileceğiniz herhangi bir görünüm kombinasyonu gibi istediğiniz herhangi bir içeriği barındırabilen ayrı bir düzendir. Daha sonra canlandıracağınız parçalarda iki düzeni kullanın. Aşağıdaki düzen, bir kartın tek tarafını oluşturur ve bu taraf metin gösterir:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="#a6c"
    android:padding="16dp"
    android:gravity="bottom">

    <TextView android:id="@android:id/text1"
        style="?android:textAppearanceLarge"
        android:textStyle="bold"
        android:textColor="#fff"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/card_back_title" />

    <TextView style="?android:textAppearanceSmall"
        android:textAllCaps="true"
        android:textColor="#80ffffff"
        android:textStyle="bold"
        android:lineSpacingMultiplier="1.2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="@string/card_back_description" />

</LinearLayout>

Sonraki düzen, kartın ImageView gösteren diğer tarafını oluşturur:

<ImageView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/image1"
    android:scaleType="centerCrop"
    android:contentDescription="@string/description_image_1" />

Parçaları oluşturma

Kartın önü ve arkası için parça sınıfları oluşturun. Parça sınıflarınızda onCreateView() yönteminden oluşturduğunuz düzenleri döndürün. Daha sonra, kartı göstermek istediğiniz üst etkinlikte bu parçanın örneklerini oluşturabilirsiniz.

Aşağıdaki örnekte, bunları kullanan üst etkinliğin içindeki iç içe yerleştirilmiş parça sınıfları gösterilmektedir:

class CardFlipActivity : FragmentActivity() {
    ...
    /**

                    *   A fragment representing the front of the card.
     */
    class CardFrontFragment : Fragment() {

    override fun onCreateView(
                inflater: LayoutInflater,
                container: ViewGroup?,
                savedInstanceState: Bundle?
    ): View = inflater.inflate(R.layout.fragment_card_front, container, false)
    }

    /**
    *   A fragment representing the back of the card.
    */
    class CardBackFragment : Fragment() {

    override fun onCreateView(
                inflater: LayoutInflater,
                container: ViewGroup?,
                savedInstanceState: Bundle?
    ): View = inflater.inflate(R.layout.fragment_card_back, container, false)
    }
}

public class CardFlipActivity extends FragmentActivity {
    ...
    /**
    *   A fragment representing the front of the card.
    */
    public class CardFrontFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            return inflater.inflate(R.layout.fragment_card_front, container, false);
    }
    }

    /**
    *   A fragment representing the back of the card.
    */
    public class CardBackFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            return inflater.inflate(R.layout.fragment_card_back, container, false);
    }
    }
}

Kart çevirme animasyonu

Parçaları bir üst etkinlik içinde görüntüleyin. Bunu yapmak için, etkinliğinizin düzenini oluşturun. Aşağıdaki örnek, çalışma zamanında parçalar ekleyebileceğiniz bir FrameLayout oluşturur:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

Etkinlik kodunda, içerik görünümünü oluşturduğunuz düzene ayarlayın. Etkinlik oluşturulduğunda varsayılan parçanın gösterilmesi iyi bir uygulamadır. Aşağıdaki örnek etkinlikte kartın ön yüzünün varsayılan olarak nasıl görüntüleneceği gösterilmektedir:

class CardFlipActivity : FragmentActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_activity_card_flip)
        if (savedInstanceState == null) {
            supportFragmentManager.beginTransaction()
                    .add(R.id.container, CardFrontFragment())
                    .commit()
        }
    }
    ...
}

public class CardFlipActivity extends FragmentActivity {

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

        if (savedInstanceState == null) {
            getSupportFragmentManager()
                    .beginTransaction()
                    .add(R.id.container, new CardFrontFragment())
                    .commit();
        }
    }
    ...
}

Kartın ön tarafı gösterildiğinde, çevirme animasyonuyla kartın arkasını uygun bir zamanda gösterebilirsiniz. Aşağıdaki işlemleri yapan kartın diğer tarafını gösterecek bir yöntem oluşturun:

• Parça geçişleri için oluşturduğunuz özel animasyonları ayarlar.
• Görüntülenen parçayı yeni bir parçayla değiştirir ve bu etkinliği, oluşturduğunuz özel animasyonlarla canlandırır.
• Daha önce görüntülenen parçayı, arkadaki parça yığınına ekler. Böylece, kullanıcı Geri düğmesine dokunduğunda kart tekrar ters döner.

class CardFlipActivity : FragmentActivity() {
    ...
    private fun flipCard() {
        if (showingBack) {
            supportFragmentManager.popBackStack()
            return
        }

        // Flip to the back.

        showingBack = true

        // Create and commit a new fragment transaction that adds the fragment
        // for the back of the card, uses custom animations, and is part of the
        // fragment manager's back stack.

        supportFragmentManager.beginTransaction()

                // Replace the default fragment animations with animator
                // resources representing rotations when switching to the back
                // of the card, as well as animator resources representing
                // rotations when flipping back to the front, such as when the
                // system Back button is tapped.
                .setCustomAnimations(
                        R.animator.card_flip_right_in,
                        R.animator.card_flip_right_out,
                        R.animator.card_flip_left_in,
                        R.animator.card_flip_left_out
                )

                // Replace any fragments in the container view with a fragment
                // representing the next page, indicated by the just-incremented
                // currentPage variable.
                .replace(R.id.container, CardBackFragment())

                // Add this transaction to the back stack, letting users press
                // the Back button to get to the front of the card.
                .addToBackStack(null)

                // Commit the transaction.
                .commit()
    }
}

public class CardFlipActivity extends FragmentActivity {
    ...
    private void flipCard() {
        if (showingBack) {
            getSupportFragmentManager().popBackStack();
            return;
        }

        // Flip to the back.

        showingBack = true;

        // Create and commit a new fragment transaction that adds the fragment
        // for the back of the card, uses custom animations, and is part of the
        // fragment manager's back stack.

        getSupportFragmentManager()
                .beginTransaction()

                // Replace the default fragment animations with animator
                // resources representing rotations when switching to the back
                // of the card, as well as animator resources representing
                // rotations when flipping back to the front, such as when the
                // system Back button is pressed.
                .setCustomAnimations(
                        R.animator.card_flip_right_in,
                        R.animator.card_flip_right_out,
                        R.animator.card_flip_left_in,
                        R.animator.card_flip_left_out)

                // Replace any fragments in the container view with a fragment
                // representing the next page, indicated by the just-incremented
                // currentPage variable.
                .replace(R.id.container, new CardBackFragment())

                // Add this transaction to the back stack, letting users press
                // Back to get to the front of the card.
                .addToBackStack(null)

                // Commit the transaction.
                .commit();
    }
}

Dairesel açma animasyonu oluşturun

Beden animasyonları, bir kullanıcı arayüzü öğesi grubunu gösterdiğinizde veya gizlediğinizde kullanıcılara görsel devamlılık sağlar. ViewAnimationUtils.createCircularReveal() yöntemi, kırpma dairesini canlandırarak bir görünümü ortaya çıkarmayı veya gizlemeyi sağlar. Bu animasyon, Android 5.0 (API düzeyi 21) ve sonraki sürümlerde kullanılabilen ViewAnimationUtils sınıfında sağlanır.

Aşağıda, önceden görünmez olan bir görünümün nasıl açığa çıkarılacağını gösteren bir örnek verilmiştir:

// A previously invisible view.
val myView: View = findViewById(R.id.my_view)

// Check whether the runtime version is at least Android 5.0.
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    // Get the center for the clipping circle.
    val cx = myView.width / 2
    val cy = myView.height / 2

    // Get the final radius for the clipping circle.
    val finalRadius = Math.hypot(cx.toDouble(), cy.toDouble()).toFloat()

    // Create the animator for this view. The start radius is 0.
    val anim = ViewAnimationUtils.createCircularReveal(myView, cx, cy, 0f, finalRadius)
    // Make the view visible and start the animation.
    myView.visibility = View.VISIBLE
    anim.start()
} else {
    // Set the view to invisible without a circular reveal animation below
    // Android 5.0.
    myView.visibility = View.INVISIBLE
}

// A previously invisible view.
View myView = findViewById(R.id.my_view);

// Check whether the runtime version is at least Android 5.0.
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    // Get the center for the clipping circle.
    int cx = myView.getWidth() / 2;
    int cy = myView.getHeight() / 2;

    // Get the final radius for the clipping circle.
    float finalRadius = (float) Math.hypot(cx, cy);

    // Create the animator for this view. The start radius is 0.
    Animator anim = ViewAnimationUtils.createCircularReveal(myView, cx, cy, 0f, finalRadius);

    // Make the view visible and start the animation.
    myView.setVisibility(View.VISIBLE);
    anim.start();
} else {
    // Set the view to invisible without a circular reveal animation below
    // Android 5.0.
    myView.setVisibility(View.INVISIBLE);
}

ViewAnimationUtils.createCircularReveal() animasyonu beş parametre alır. İlk parametre, ekranda gizlemek veya göstermek istediğiniz görünümdür. Sonraki iki parametre, kırpma dairesinin merkezi için X ve Y koordinatlarıdır. Genellikle bu, görünümün merkezidir ancak animasyonun seçtiği yerde başlaması için kullanıcının dokunduğu noktayı da kullanabilirsiniz. Dördüncü parametre, kırpma dairesinin başlangıç yarıçapıdır.

Yukarıdaki örnekte, ilk yarıçap sıfır olarak ayarlanmıştır. Böylece, görüntülenen görünüm daire tarafından gizlenir. Son parametre, dairenin son yarıçapıdır. Bir görünümü görüntülerken, animasyon tamamlanmadan önce görünümün tamamen ortaya çıkarılabilmesi için nihai yarıçapı görünümden daha büyük hale getirin.

Önceden görülebilen bir görünümü gizlemek için aşağıdakileri yapın:

// A previously visible view.
val myView: View = findViewById(R.id.my_view)

// Check whether the runtime version is at least Android 5.0.
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    // Get the center for the clipping circle.
    val cx = myView.width / 2
    val cy = myView.height / 2

    // Get the initial radius for the clipping circle.
    val initialRadius = Math.hypot(cx.toDouble(), cy.toDouble()).toFloat()

    // Create the animation. The final radius is 0.
    val anim = ViewAnimationUtils.createCircularReveal(myView, cx, cy, initialRadius, 0f)

    // Make the view invisible when the animation is done.
    anim.addListener(object : AnimatorListenerAdapter() {

        override fun onAnimationEnd(animation: Animator) {
            super.onAnimationEnd(animation)
            myView.visibility = View.INVISIBLE
        }
    })

    // Start the animation.
    anim.start()
} else {
    // Set the view to visible without a circular reveal animation below
    // Android 5.0.
    myView.visibility = View.VISIBLE
}

// A previously visible view.
final View myView = findViewById(R.id.my_view);

// Check whether the runtime version is at least Android 5.0.
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
    // Get the center for the clipping circle.
    int cx = myView.getWidth() / 2;
    int cy = myView.getHeight() / 2;

    // Get the initial radius for the clipping circle.
    float initialRadius = (float) Math.hypot(cx, cy);

    // Create the animation. The final radius is 0.
    Animator anim = ViewAnimationUtils.createCircularReveal(myView, cx, cy, initialRadius, 0f);

    // Make the view invisible when the animation is done.
    anim.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            super.onAnimationEnd(animation);
            myView.setVisibility(View.INVISIBLE);
        }
    });

    // Start the animation.
    anim.start();
} else {
    // Set the view to visible without a circular reveal animation below Android
    // 5.0.
    myView.setVisibility(View.VISIBLE);
}

Bu durumda, kırpma dairesinin ilk yarıçapı, görünümün animasyon başlamadan önce görülebilmesi için görünüm kadar büyük olarak ayarlanır. Son yarıçap, animasyon tamamlandığında görünümün gizlenmesi için sıfır olarak ayarlanır. Animasyona bir işleyici ekleyin. Böylece, animasyon tamamlandığında görünümün görünürlüğünü INVISIBLE olarak ayarlayabilirsiniz.

Ek kaynaklar

• Jetpack Compose ile Animasyon.
• Jetpack Compose ile hareketler.