Bir noktadan büyüyen animasyonla DialogFragment'ı göster

Question 1

DialogFragmentKullanıcı bir satıra dokunduğunda bir gösteriyorum ListView. Satır ortasından itibaren büyümesi için iletişim kutusunun gösterimini canlandırmak istiyorum. Başlatıcıdan bir klasör açarken benzer bir etki görülebilir.

Sahip olduğum bir fikir, TranslateAnimationve kombinasyonudur ScaleAnimation. Başka bir yolu var mı?

Question 2

Being DialogFragmentiçin bir sarıcı Dialogsınıfın, kendi tabanına bir tema belirlesin Dialogistediğiniz animasyonu almak için:

public class CustomDialogFragment extends DialogFragment implements OnEditorActionListener
{
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) 
    {
        return super.onCreateView(inflater, container, savedInstanceState);
    }

    @Override
    public Dialog onCreateDialog(Bundle savedInstanceState) 
    {
        // Set a theme on the dialog builder constructor!
        AlertDialog.Builder builder = 
            new AlertDialog.Builder( getActivity(), R.style.MyCustomTheme );

        builder  
        .setTitle( "Your title" )
        .setMessage( "Your message" )
        .setPositiveButton( "OK" , new DialogInterface.OnClickListener() 
            {      
              @Override
              public void onClick(DialogInterface dialog, int which) {
              dismiss();                  
            }
        });
        return builder.create();
    }
}

Ardından, istediğiniz animasyonu içerecek temayı tanımlamanız yeterlidir. In styles.xml özel tema ekleyin:

<style name="MyCustomTheme" parent="@android:style/Theme.Panel">
    <item name="android:windowAnimationStyle">@style/MyAnimation.Window</item>
</style>

<style name="MyAnimation.Window" parent="@android:style/Animation.Activity"> 
    <item name="android:windowEnterAnimation">@anim/anim_in</item>
    <item name="android:windowExitAnimation">@anim/anim_out</item>
</style>

Şimdi animasyon dosyalarını res / anim klasörüne ekleyin :

( android:pivotYanahtar)

anim_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/linear_interpolator"
        android:fromXScale="0.0"
        android:toXScale="1.0"
        android:fromYScale="0.0"
        android:toYScale="1.0"
        android:fillAfter="false"
        android:startOffset="200"
        android:duration="200" 
        android:pivotX = "50%"
        android:pivotY = "-90%"
    />
    <translate
        android:fromYDelta="50%"
        android:toYDelta="0"
        android:startOffset="200"
        android:duration="200"
    />
</set>

anim_out.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
    <scale
        android:interpolator="@android:anim/linear_interpolator"
        android:fromXScale="1.0"
        android:toXScale="0.0"
        android:fromYScale="1.0"
        android:toYScale="0.0"
        android:fillAfter="false"
        android:duration="200" 
        android:pivotX = "50%"        
        android:pivotY = "-90%"        
    />
    <translate
        android:fromYDelta="0"
        android:toYDelta="50%"
        android:duration="200"
    />
</set>

Son olarak, buradaki zor olan, animasyonunuzun her satırın ortasından büyümesini sağlamaktır. Sanırım satır ekranı yatay olarak dolduruyor, bu yüzden bir yandan android:pivotXdeğer statik olacak. Öte yandan, android:pivotYdeğeri programlı olarak değiştiremezsiniz .

Önerdiğim şey, her biri android:pivotYöznitelikte farklı bir yüzde değerine (ve bu animasyonlara atıfta bulunan birkaç temaya) sahip birkaç animasyon tanımlamanızdır . Ardından, kullanıcı satıra dokunduğunda, ekrandaki satırın yüzdesi olarak Y konumunu hesaplayın. Yüzde cinsinden konumu bilerek, diyaloğunuza uygun android:pivotYdeğere sahip bir tema atayın .

Mükemmel bir çözüm değil ama sizin için hile yapabilir. Sonucu beğenmezseniz, o zaman DialogFragmentbasit bir Viewbüyümeyi unutmanızı ve sıranın tam ortasından hareketlendirmenizi öneririm .

İyi şanslar!

Question 3

Bu koda bakın, benim için çalışıyor

// Animasyonu yukarı kaydır

<?xml version="1.0" encoding="utf-8"?> <set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromYDelta="100%"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toXDelta="0" />

</set>

// Slayt dowm animasyonu

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >

    <translate
        android:duration="@android:integer/config_mediumAnimTime"
        android:fromYDelta="0%p"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toYDelta="100%p" />

</set>

// Stil

<style name="DialogAnimation">
    <item name="android:windowEnterAnimation">@anim/slide_up</item>
    <item name="android:windowExitAnimation">@anim/slide_down</item>
</style>

// Dialog Parçası İçinde

@Override
public void onActivityCreated(Bundle arg0) {
    super.onActivityCreated(arg0);
    getDialog().getWindow()
    .getAttributes().windowAnimations = R.style.DialogAnimation;
}

Question 4

DialogFragment, tam da bu nedenle kullanabileceğiniz genel bir getTheme () yöntemine sahiptir. Bu çözüm daha az kod satırı kullanır:

public class MyCustomDialogFragment extends DialogFragment{
    ...
    @Override
    public int getTheme() {
        return R.style.MyThemeWithCustomAnimation;
    }
}

Question 5

Animasyonlu tam ekran bir iletişim kutusu almak için aşağıdakileri yazın ...

Stiller:

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
    <item name="actionModeBackground">?attr/colorPrimary</item>
    <item name="windowActionModeOverlay">true</item>
</style>

<style name="AppTheme.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>

<style name="AppTheme.NoActionBar.FullScreenDialog">
    <item name="android:windowAnimationStyle">@style/Animation.WindowSlideUpDown</item>
</style>

<style name="Animation.WindowSlideUpDown" parent="@android:style/Animation.Activity">
    <item name="android:windowEnterAnimation">@anim/slide_up</item>
    <item name="android:windowExitAnimation">@anim/slide_down</item>
</style>

res / anim / slide_up.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
     android:shareInterpolator="@android:interpolator/accelerate_quad">

    <translate
        android:duration="@android:integer/config_shortAnimTime"
        android:fromYDelta="100%"
        android:toYDelta="0%"/>
</set>

res / anim / slide_down.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
     android:shareInterpolator="@android:interpolator/accelerate_quad">

    <translate
        android:duration="@android:integer/config_shortAnimTime"
        android:fromYDelta="0%"
        android:toYDelta="100%"/>
</set>

Java kodu:

public class MyDialog extends DialogFragment {

    @Override
    public int getTheme() {
        return R.style.AppTheme_NoActionBar_FullScreenDialog;
    }
}

private void showDialog() {
    FragmentTransaction fragmentTransaction = getSupportFragmentManager().beginTransaction();
    Fragment previous = getSupportFragmentManager().findFragmentByTag(MyDialog.class.getName());
    if (previous != null) {
        fragmentTransaction.remove(previous);
    }
    fragmentTransaction.addToBackStack(null);

    MyDialog dialog = new MyDialog();
    dialog.show(fragmentTransaction, MyDialog.class.getName());
}

Question 6

Diyalog parçanızda onStart içindeki dekor görünümünü kullanın

@Override
public void onStart() {
    super.onStart();


    final View decorView = getDialog()
            .getWindow()
            .getDecorView();

    decorView.animate().translationY(-100)
            .setStartDelay(300)
            .setDuration(300)
            .start();

}

Question 7

DialogFragment'ta özel animasyon onCreateDialog olarak adlandırılır. 'DialogAnimation' önceki cevapta özel animasyon stilidir.

public Dialog onCreateDialog(Bundle savedInstanceState) 
{
    final Dialog dialog = super.onCreateDialog(savedInstanceState);
    dialog.getWindow().getAttributes().windowAnimations = R.style.DialogAnimation;
    return dialog;
}

Question 8

Android Geliştiricilerinin Görünümü Yakınlaştırma Eğitimi'ne baktınız mı ? İyi bir başlangıç noktası olabilir.

Muhtemelen bunu çalıştırmak için özel bir sınıf oluşturmak istersiniz DialogFragment.

Ayrıca, Jake Whartons NineOldAndroids for Honeycomb Animation API uyumluluğuna, API Seviye 1'e kadar bir göz atın .

Question 9

API'ler üzerinden çalışmak istiyorsanız, onCreateDialog içinde değil, DialogFragemnt-> onStart içinde yapmanız gerekir.

@Override
    public void onStart() 
    {
        if (getDialog() == null) 
        {
            return;
        }

        getDialog().getWindow().setWindowAnimations(
                  R.style.DlgAnimation);

        super.onStart();
    }

Question 10

Bu kodu değerler animuna ekle

 <scale
    android:duration="@android:integer/config_longAnimTime"
    android:fromXScale="0.2"
    android:fromYScale="0.2"
    android:toXScale="1.0"
    android:toYScale="1.0"
    android:pivotX="50%"
    android:pivotY="50%"/>
<alpha
    android:fromAlpha="0.1"
    android:toAlpha="1.0"
    android:duration="@android:integer/config_longAnimTime"
    android:interpolator="@android:anim/accelerate_decelerate_interpolator"/>

styles.xml çağrısı

<style name="DialogScale">
    <item name="android:windowEnterAnimation">@anim/scale_in</item>
    <item name="android:windowExitAnimation">@anim/scale_out</item>
</style>

Java kodunda: Onclick'i ayarlayın

public void onClick(View v) {
        fab_onclick(R.style.DialogScale, "Scale" ,(Activity) context,getWindow().getDecorView().getRootView());
      //  Dialogs.fab_onclick(R.style.DialogScale, "Scale");

    }

yöntemde kurulum:

alertDialog.getWindow().getAttributes().windowAnimations = type;