एक बिंदु से बढ़ रहे एनीमेशन के साथ DialogFragment दिखाएं


93

DialogFragmentउपयोगकर्ता द्वारा पंक्ति में एक पर टैप करने पर मैं दिखा रहा हूं ListView। मैं संवाद दिखाना पसंद करना चाहूंगा ताकि यह पंक्ति के केंद्र से बढ़े। लॉन्चर से एक फ़ोल्डर खोलते समय एक समान प्रभाव देखा जा सकता है।

एक विचार है कि मेरे पास एक संयोजन TranslateAnimationऔर है ScaleAnimation। क्या कोई और तरीका है?


1
DialogFragment पर एनिमेशन के लिए लिंक देखें ।
एएसएच

जवाबों:


168

वर्ग के DialogFragmentलिए एक आवरण होने के नाते Dialog, आपको अपने Dialogइच्छित एनीमेशन को प्राप्त करने के लिए अपने बेस पर एक थीम सेट करना चाहिए :

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

फिर आपको बस उस थीम को परिभाषित करने की आवश्यकता है जिसमें आपका वांछित एनीमेशन शामिल होगा। में styles.xml आपकी कस्टम थीम जोड़ें:

<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>    

अब Res / एनिमेशन फोल्डर में एनीमेशन फाइल्स जोड़ें :

( android:pivotYकुंजी है)

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>

अंत में, यहां मुश्किल बात यह है कि प्रत्येक पंक्ति के केंद्र से अपने एनीमेशन को विकसित करना है। मुझे लगता है कि पंक्ति क्षैतिज रूप से स्क्रीन को भर रही है, इसलिए एक तरफ android:pivotXमूल्य स्थिर होगा। दूसरी ओर, आप android:pivotYमान को प्रोग्रामेटिक रूप से संशोधित नहीं कर सकते ।

मेरा सुझाव है कि, आप कई एनिमेशनों को परिभाषित करते हैं, जिनमें से प्रत्येक की android:pivotYविशेषता पर एक अलग प्रतिशत मूल्य है (और उन एनिमेशन को संदर्भित करने वाले कई थीम)। फिर, जब उपयोगकर्ता पंक्ति को टैप करता है, तो स्क्रीन पर पंक्ति के प्रतिशत में वाई स्थिति की गणना करें। प्रतिशत में स्थिति जानने के बाद, अपने संवाद के लिए एक विषय निर्दिष्ट करें जिसका उचित android:pivotYमूल्य है।

यह एक सही समाधान नहीं है, लेकिन आप के लिए चाल कर सकता है। यदि आपको परिणाम पसंद नहीं है, तो मैं सुझाव दूंगा कि आप पंक्ति के सटीक केंद्र से DialogFragmentएक साधारण Viewवृद्धि को भूल जाएं और उसे अनुप्राणित करें ।

सौभाग्य!


स्क्रीन पर विभिन्न स्थानों के लिए कई एनिमेशन के साथ अच्छा विचार। यह एक हैक है, लेकिन यह एकमात्र तरीका है।
एडवर्ड डेल

यह केवल wok के साथ होगा> एपीआई 11 @ किरान बाबू जवाब एक काम के आसपास है
ब्लंडेल

क्या आपको पता है कि इन एनिमेशन के पूरा होने पर कॉलबैक पाने का कोई संभावित तरीका है? मैं एक 2-भाग एनीमेशन करना चाहता हूं, एक जहां संवाद स्लाइड में है, और फिर विचारों को लुप्त हो रहा है। मैं एक श्रोता को विंडो में कैसे जोड़ूंगा?
android_student

बढ़िया! यह स्पष्ट है कि मैंने देखा है!
एलेक्सी टिमोशेंको

2
स्थापना विषय कर के रूप में सरल रूप में हो सकता है setStyle(DialogFragment.STYLE_NORMAL, R.style.MyCustomTheme)पर onCreate(bundle): देखें developer.android.com/reference/android/app/DialogFragment.html
tropicalfish

117

यह कोड देखें, यह मेरे लिए काम करता है

// एनीमेशन ऊपर स्लाइड

<?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>

// स्लाइड डॉम एनीमेशन

<?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>

// अंदाज

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

// इनसाइड डायलॉग फ्रैगमेंट

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

8
क्षमा करें, यह मेरे प्रश्न का उत्तर नहीं देता है।
एडवर्ड डेल

3
यह ठीक नहीं हो सकता है कि ओपी क्या पूछ रहा है, लेकिन यह एक अच्छा प्रवेश बिंदु है, मुझे लगता है।
mdelolmo

2
बहुत बढ़िया उदाहरण! एकमात्र नमूना जिसने मेरे लिए काम किया। ट्रिक onActivity में एनीमेशन / थीम सेट करना है। (...) विधि
tomurka

3
यह उपयोगी हो सकता है लेकिन यह सवाल का जवाब नहीं देता है।
ओलायिन्का

क्या आपको पता है कि इन एनिमेशन के पूरा होने पर कॉलबैक पाने का कोई संभावित तरीका है? मैं एक 2-भाग एनीमेशन करना चाहता हूं, एक जहां संवाद स्लाइड में है, और फिर विचारों को लुप्त हो रहा है। मैं एक श्रोता को विंडो में कैसे जोड़ूंगा?
Android_student

22

DialogFragment में एक सार्वजनिक getTheme () विधि है जिसे आप इस सटीक कारण के लिए सवारी कर सकते हैं। यह समाधान कोड की कम लाइनों का उपयोग करता है:

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

1
कोई और चिंता नहीं ... सरल और सीधा समाधान।
नंदला संदीप

यह मेरे लिए सबसे अच्छा जवाब है!
सुपरस्टार

मूल प्रश्न से संबंधित नहीं होने के दौरान, मेरे पास MainAitvity में एक गैलरी दिखाई गई थी जहाँ उपयोगकर्ता क्लिक DialogFragment में स्लाइड शो को सक्रिय करेगा। हालांकि स्लाइड शो से लौटते समय मेनऐक्टिविटी में एक झटका लगता है। यह MainActivity का उपयोग करने के कारण होता है AppTheme.NoActionBarजबकि DialogFragment डिफ़ॉल्ट का उपयोग कर रहा है AppTheme। ऊपर की विधि ने खंड और गतिविधि दोनों में लगातार विषय होने से मेरी समस्या को हल किया।
tingyik90

भाई, आप प्रतिभाशाली हैं
जैकी चोंग

इस समाधान ने मेरे लिए काम किया। हालाँकि एक बात ने मुझे भ्रमित कर दिया; WindowEnterAnimation या windowExitAnimation को सीधे थीम में सेट करने से मेरे DialogFragments एनिमेशन में कोई फर्क नहीं पड़ेगा। केवल एक चीज जो मेरे लिए काम करती थी, एक अलग XML फ़ाइल में windowAnimationStyle सेट कर रहा था, जिसने शैली को परिभाषित किया और वहां प्रवेश और निकास एनिमेशन की स्थापना की
szaske

9

एनीमेशन के साथ एक पूर्ण-स्क्रीन संवाद प्राप्त करने के लिए, निम्नलिखित लिखें ...

शैलियाँ:

<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>

रेस / 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>

रेस / 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>

जावा कोड:

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

4

अपने संवाद खंड में ऑनस्टार्ट के अंदर सजावट दृश्य का उपयोग करें

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


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

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

}

1
अंतर्निहित दृश्य बाद में क्लिक करने योग्य प्रतीत नहीं होता है
हेडनकै

3

DialogFragment में, कस्टम एनीमेशन को onCreateDialog कहा जाता है। 'DialogAnimation' पिछले उत्तर में कस्टम एनीमेशन शैली है।

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

1

क्या आपने जूमिंग व्यू पर एंड्रॉइड डेवलपर्स ट्रेनिंग देखी है ? एक अच्छा प्रारंभिक बिंदु हो सकता है।

आप शायद DialogFragmentयह काम पाने के लिए एक कस्टम वर्ग बनाना चाहते हैं ।

इसके अलावा, हनीकॉम्ब एनिमेशन एपीआई कम्पैटिबिलिटी के लिए जेक व्हार्टन नाइनओल्डएंड्रॉइड्स पर एक नज़र डालें, जो एपीआई स्तर 1 पर है।


1

यदि आप API पर काम करना चाहते हैं तो आपको अपने DialogFragemnt-> onStart के अंदर करना होगा और onCreateDialog के अंदर नहीं करना चाहिए

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

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

        super.onStart();
    }

मेरी राय में सबसे अच्छा समाधान। यह AlertDialogs के लिए भी काम करता है, बस इसे onShowListener में उपयोग करें। धन्यवाद!
गाबोर नोवाक

0

इस कोड को वैल्यू एनिमेशन पर जोड़ें

 <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"/>

स्टाइल पर कॉल करें। xml

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

जावा कोड पर: ऑनक्लिक सेट करें

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

    }

विधि पर सेटअप:

alertDialog.getWindow().getAttributes().windowAnimations = type;
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.