ProgressBar / ProgressDialog के लिए कस्टम ड्रॉबल


128

Google ने जो सीमित दस्तावेज उपलब्ध कराए हैं, उन्हें पढ़कर मुझे लगता है कि प्रोग्रेसबार / प्रोग्रेसडियोगॉग के लुक (ड्रॉबल) को बस एक नई शैली बनाकर उसे प्रोग्रेसबार की स्टाइल प्रॉपर्टी में बदल देना संभव है। लेकिन मुझे यह ठीक से काम करने के लिए नहीं मिल सकता है। यहाँ मैंने अभी तक क्या किया है:

मैंने इस तरह एक आकृति बनाई (mp2.xml)

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
  android:shape="ring"
  android:innerRadiusRatio="4"
  android:thicknessRatio="4"
  android:useLevel="false">
 <size android:width="50dip" android:height="50dip" />
 <gradient android:type="sweep" android:useLevel="false" android:startColor="#300000ff" android:centerColor="#500000ff" android:endColor="#ff0000ff" />
</shape>

फिर इस तरह एक एनीमेशन (mp3.xml) बनाया:

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" android:oneshot="false">
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0" android:toDegrees="30" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="30" android:toDegrees="60" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="60" android:toDegrees="90" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="90" android:toDegrees="120" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="120" android:toDegrees="150" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="150" android:toDegrees="180" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="180" android:toDegrees="210" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="210" android:toDegrees="240" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="240" android:toDegrees="270" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="270" android:toDegrees="300" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="300" android:toDegrees="330" android:repeatCount="1" />
 </item>
 <item android:duration="70">
  <rotate xmlns:android="http://schemas.android.com/apk/res/android" android:drawable="@drawable/mp2" android:pivotX="50%" android:pivotY="50%" android:fromDegrees="330" android:toDegrees="360" android:repeatCount="1" />
 </item>
</animation-list>

फिर इस तरह एक स्टाइल (attrs.xml) बनाया:

<?xml version="1.0" encoding="utf-8"?>
<resources>
 <style parent="@android:style/Widget.ProgressBar" name="customProgressBar">
  <item name="android:progressDrawable">@anim/mp3</item>
 </style>
</resources>

और मेरे main.xml में मैंने इस तरह शैली निर्धारित की है:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:orientation="vertical"
       android:layout_width="fill_parent"
       android:layout_height="fill_parent" android:drawingCacheQuality="high">
 <ProgressBar android:id="@+id/ProgressBar01"
     android:layout_width="wrap_content"
     android:layout_height="wrap_content" style="@style/customProgressBar"/>
</LinearLayout>

लेकिन यह अब भी पहले जैसा ही देखने योग्य है। मैं क्या गलत कर रहा हूं?


बस नमूने ब्राउज़ करने के लिए हुआ और इसे पढ़ने के बाद आपके पास आया । उम्मीद है कि यह आपकी समस्या को हल करता है।
पुनर्जन्म

मुझे पता था कि कैसे आकृतियाँ / क्रमिक / एनीमेशन बनाना है। जो मैंने ऊपर बनाया है वह उस पोस्टिंग पर आधारित है जिसे आप संदर्भित कर रहे हैं (मुझे इसे थोड़ा बदलना होगा क्योंकि यह बहुत ही डरावना और धीमा लग रहा है)। मैं बस "शैली" का उपयोग करके इसे प्राप्त करने में सक्षम होने की उम्मीद कर रहा था। वैसे भी प्रतिशोध के लिए धन्यवाद
सैम

यदि आप अपनी प्रगति पट्टी को पूरी तरह से अनुकूलित करना चाहते हैं और वास्तव में फैंसी हैं तो इस ब्लॉग पोस्ट पर एक नज़र डालें। यह थोड़ा परे हो सकता है कि आप क्या चाहते थे या हो सकता है कि आपकी तलाश क्या है। आशा करता हूँ की ये काम करेगा!
जगसौंद

जवाबों:


142

मैंने एक कस्टम प्रगति पट्टी बनाने के लिए निम्नलिखित का उपयोग किया।

फ़ाइल res/drawable/progress_bar_states.xmlविभिन्न राज्यों के रंगों की घोषणा करती है:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:id="@android:id/background">
        <shape>
            <gradient
                    android:startColor="#000001"
                    android:centerColor="#0b131e"
                    android:centerY="0.75"
                    android:endColor="#0d1522"
                    android:angle="270"
            />
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <gradient
                        android:startColor="#234"
                        android:centerColor="#234"
                        android:centerY="0.75"
                        android:endColor="#a24"
                        android:angle="270"
                />
            </shape>
        </clip>
    </item>

    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <gradient
                    android:startColor="#144281"
                    android:centerColor="#0b1f3c"
                    android:centerY="0.75"
                    android:endColor="#06101d"
                    android:angle="270"
                />
            </shape>
        </clip>
    </item>

</layer-list>

और आपके लेआउट xml के अंदर का कोड:

<ProgressBar android:id="@+id/progressBar"
    android:progressDrawable="@drawable/progress_bar_states"
    android:layout_width="fill_parent" android:layout_height="8dip" 
    style="?android:attr/progressBarStyleHorizontal" 
    android:indeterminateOnly="false" 
    android:max="100">
</ProgressBar>

का आनंद लें!


@YuliaRogovaya यह इसलिए है क्योंकि ड्राफ़्ट क्लिप तत्वों में नहीं हैं? मैं इसे या तो काम नहीं कर सका; क्लिप तत्व का संदेह कुंजी है।
एंड्रयू व्येल

2
यह कैसे करना है ProgressDialog?
नजम

@Nezam मैं आपको सटीक कोड या नमूने नहीं दे सकता, लेकिन आपको यही करना होगा। ProgressDialog को एक कस्टम थीम प्रदान करें। कस्टम थीम प्रगति की शैली को परिभाषित करेगा।
जोना

इस चीज़ का स्क्रीनशॉट कार्रवाई में देखना अच्छा होगा
QED

@ जोना मुझे पता है कि कुछ समय हो गया है, लेकिन मैं इस ड्रॉबल को ऊंचाई में छोटा कैसे बना सकता हूं ??
leofontes

55

मुझे यहाँ समाधान के साथ एक Indeterminate प्रगति संवाद का उपयोग करने में कुछ परेशानी हो रही थी, कुछ काम और परीक्षण और त्रुटि के बाद मुझे यह काम करने के लिए मिला।

सबसे पहले, प्रोग्रेस डायलॉग के लिए आप जिस एनीमेशन का उपयोग करना चाहते हैं, उसे बनाएं। मेरे मामले में मैंने 5 छवियों का उपयोग किया।

../res/anim/progress_dialog_icon_drawable_animation.xml:

<animation-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/icon_progress_dialog_drawable_1" android:duration="150" />
    <item android:drawable="@drawable/icon_progress_dialog_drawable_2" android:duration="150" />
    <item android:drawable="@drawable/icon_progress_dialog_drawable_3" android:duration="150" />
    <item android:drawable="@drawable/icon_progress_dialog_drawable_4" android:duration="150" />
    <item android:drawable="@drawable/icon_progress_dialog_drawable_5" android:duration="150" />
</animation-list>

जहाँ आप एक ProgressDialog दिखाना चाहते हैं:

dialog = new ProgressDialog(Context.this);
dialog.setIndeterminate(true);
dialog.setIndeterminateDrawable(getResources().getDrawable(R.anim.progress_dialog_icon_drawable_animation));
dialog.setMessage("Some Text");
dialog.show();

यह समाधान वास्तव में सरल है और मेरे लिए काम करता है, आप ProgressDialog का विस्तार कर सकते हैं और इसे आंतरिक रूप से आकर्षित करने योग्य बना सकते हैं, हालांकि, यह वास्तव में बहुत जटिल था, जिसकी मुझे आवश्यकता थी इसलिए मैंने ऐसा नहीं किया।


1
नोटिंग के लिए धन्यवाद "डायलॉग ।सेटइंडेटरमिनेट्रेडेबल ()"
स्कॉटीटैब

क्या संवाद में सिर्फ एक छवि है, इसलिए कोई संदेश नहीं है, लेकिन पूरे संवाद में एक दम है?
डिएगो

@Diego मैंने इसे आज़माया नहीं है, लेकिन मैं यह नहीं देखता कि क्यों नहीं। क्या आपने एक ड्रॉबल का उपयोग करने की कोशिश की है जो आपके इच्छित स्थान को ले जाएगा (जिसका एक लंबा पहलू अनुपात था) और डायलॉग पर कोई पाठ सेट नहीं करना चाहिए?
अंधविश्वासी

40

सेटिंग का प्रयास करें:

android:indeterminateDrawable="@drawable/progress" 

इसने मेरे लिए काम किया। यहाँ भी प्रगति के लिए कोड है। xml:

<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:pivotX="50%" android:pivotY="50%" android:fromDegrees="0"
    android:toDegrees="360">

    <shape android:shape="ring" android:innerRadiusRatio="3"
        android:thicknessRatio="8" android:useLevel="false">

        <size android:width="48dip" android:height="48dip" />

        <gradient android:type="sweep" android:useLevel="false"
            android:startColor="#4c737373" android:centerColor="#4c737373"
            android:centerY="0.50" android:endColor="#ffffd300" />

    </shape>

</rotate> 

3
अगर आप ड्रॉबल का इस्तेमाल करना चाहते हैं तो सिर्फ android:drawable=रोटेट टैग में करें और फिर शेप को हटा दें। अंत में कोई है जो कताई प्रगति बार सवाल का जवाब देता है।
मिंसमैन

2
यह रंग सेट करता है, लेकिन प्रगति पट्टी घूमती नहीं है
क्रॉलर

जल्दी से समायोजित करने के लिए रोटेशन की गति android:toDegreesको उच्च मूल्य पर सेट किया जा सकता है। यह android:toDegrees="1080"3 बार में रोटेशन को बढ़ाने के लिए सेटिंग ।
लेवोर

10

आपकी शैली इस तरह दिखनी चाहिए:

<style parent="@android:style/Widget.ProgressBar" name="customProgressBar">
    <item name="android:indeterminateDrawable">@anim/mp3</item>
</style>

6

पैमाने के साथ कस्टम प्रगति!

<?xml version="1.0" encoding="utf-8"?>
<animation-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:duration="150">
        <scale
            android:drawable="@drawable/face_no_smile_eyes_off"
            android:scaleGravity="center" />
    </item>
    <item android:duration="150">
        <scale
            android:drawable="@drawable/face_no_smile_eyes_on"
            android:scaleGravity="center" />
    </item>
    <item android:duration="150">
        <scale
            android:drawable="@drawable/face_smile_eyes_off"
            android:scaleGravity="center" />
    </item>
    <item android:duration="150">
        <scale
            android:drawable="@drawable/face_smile_eyes_on"
            android:scaleGravity="center" />
    </item>

</animation-list>

5

मैं आपका कोड .i चला सकता हूं लेकिन मुझे दो स्थानों को संशोधित करने की आवश्यकता है:

  1. name="android:indeterminateDrawable" के बजाय android:progressDrawable

  2. नाम attrs.xml ---> स्टाइल.xml संशोधित करें


आप अपने एंड्रॉइड को संशोधित करते हैं: startColor = "# 300000ff" से # FF00ff00, अन्य रंग को संशोधित करें
पेंगवांग

0

मुझे यकीन नहीं है, लेकिन इस मामले में आप अभी भी अलर्ट डायलॉग में एक अलग लेआउट फ़ाइल सेट करके पूर्ण अनुकूलित AlertDialog के साथ जा सकते हैं और अपने इमेजव्यू के लिए एनीमेशन को अपने उपरोक्त कोड के भाग का उपयोग करके सेट करें जो इसे भी करना चाहिए!


0
public class CustomProgressBar {
    private RelativeLayout rl;
    private ProgressBar mProgressBar;
    private Context mContext;
    private String color__ = "#FF4081";
    private ViewGroup layout;
    public CustomProgressBar (Context context, boolean isMiddle, ViewGroup layout) {
        initProgressBar(context, isMiddle, layout);
    }

    public CustomProgressBar (Context context, boolean isMiddle) {
        try {
            layout = (ViewGroup) ((Activity) context).findViewById(android.R.id.content).getRootView();
        } catch (Exception e) {
            e.printStackTrace();
        }
        initProgressBar(context, isMiddle, layout);
    }

    void initProgressBar(Context context, boolean isMiddle, ViewGroup layout) {
        mContext = context;
        if (layout != null) {
            int padding;
            if (isMiddle) {
                mProgressBar = new ProgressBar(context, null, android.R.attr.progressBarStyleSmall);
                // mProgressBar.setBackgroundResource(R.drawable.pb_custom_progress);//Color.parseColor("#55000000")
                padding = context.getResources().getDimensionPixelOffset(R.dimen.padding);
            } else {
                padding = context.getResources().getDimensionPixelOffset(R.dimen.padding);
                mProgressBar = new ProgressBar(context, null, android.R.attr.progressBarStyleSmall);
            }
            mProgressBar.setPadding(padding, padding, padding, padding);
            mProgressBar.setBackgroundResource(R.drawable.pg_back);
            mProgressBar.setIndeterminate(true);
                try {
                    color__ = AppData.getTopColor(context);//UservaluesModel.getAppSettings().getSelectedColor();
                } catch (Exception e) {
                    color__ = "#FF4081";
                }
                int color = Color.parseColor(color__);
//                color=getContrastColor(color);
//                color__ = color__.replaceAll("#", "");//R.color.colorAccent
                mProgressBar.getIndeterminateDrawable().setColorFilter(color, android.graphics.PorterDuff.Mode.SRC_ATOP);
            } 
            }

            RelativeLayout.LayoutParams params = new
                    RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT, RelativeLayout.LayoutParams.MATCH_PARENT);
            RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT, RelativeLayout.LayoutParams.WRAP_CONTENT);
            rl = new RelativeLayout(context);
            if (!isMiddle) {
                int valueInPixels = (int) context.getResources().getDimension(R.dimen.padding);
                lp.setMargins(0, 0, 0, (int) (valueInPixels / 1.5));//(int) Utils.convertDpToPixel(valueInPixels, context));
                rl.setClickable(false);
                lp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
            } else {
                rl.setGravity(Gravity.CENTER);
                rl.setClickable(true);
            }
            lp.addRule(RelativeLayout.CENTER_IN_PARENT);
            mProgressBar.setScaleY(1.55f);
            mProgressBar.setScaleX(1.55f);
            mProgressBar.setLayoutParams(lp);

            rl.addView(mProgressBar);
            layout.addView(rl, params);
        }
    }

    public void show() {
        if (mProgressBar != null)
            mProgressBar.setVisibility(View.VISIBLE);
    }

    public void hide() {
        if (mProgressBar != null) {
            rl.setClickable(false);
            mProgressBar.setVisibility(View.INVISIBLE);
        }
    }
}

और फिर कॉल करें

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