স্লাইডার

আপনি স্লাইডার ব্যবহার করতে পারেন স্ক্রিনের নীচে একটি লোডিং, অগ্রগতি বা নেভিগেশন বার দেখাতে। স্লাইডারগুলি হল বিশ্বব্যাপী UX উপাদান এবং আপনার গ্লাসওয়্যারে এগুলি প্রয়োগ করার সময় যত্ন সহকারে আচরণ করা উচিত।


স্ক্রোলার স্লাইডার

আপনি একাধিক কার্ডের মাধ্যমে সোয়াইপ করার সাথে সাথে একটি কার্ডের অবস্থান নির্দেশ করতে স্ক্রলার স্লাইডার ব্যবহার করা হয়। আপনি Slider.Scroller ব্যবহার করে একই ধরনের প্রভাব তৈরি করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. startScroller() ব্যবহার করে Slider.Scroller তৈরি করুন এবং সর্বোচ্চ এবং প্রাথমিক অবস্থান নির্ধারণ করুন।

এখানে একটি সাধারণ বাস্তবায়ন যা ব্যবহারকারী ট্যাপ করলে একটি স্ক্রলারকে পরবর্তী অবস্থানে অ্যানিমেট করে:

public final class SliderActivity extends Activity {

    private static final int MAX_SLIDER_VALUE = 5;
    private static final long ANIMATION_DURATION_MILLIS = 5000;

    private CardScrollView mCardScroller;
    private Slider mSlider;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                processSliderRequest(position+1);
            }
        });

        setContentView(mCardScroller);
    }

    private void processSliderRequest(position) {
        Slider.Scroller scroller = mSlider.startScroller(MAX_SLIDER_VALUE, 0);

        // Animate the slider to the next position. The slider
        // automatically hides after the duration has elapsed
        ObjectAnimator.ofFloat(scroller, "position", 0, position)
            .setDuration(ANIMATION_DURATION_MILLIS)
            .start();
    }
}

গ্রেস পিরিয়ড স্লাইডার

গ্রেস পিরিয়ড স্লাইডারগুলি এমন ক্রিয়াকলাপে কাজ করে যেখানে এটি একটি ব্যবহারকারীর জন্য একটি বিজ্ঞপ্তি দেখতে উপযোগী, তবে ব্যবহারকারীর মিথস্ক্রিয়া প্রয়োজন হয় না। আপনি Slider.GracePeriod ব্যবহার করে এই অ্যানিমেশন যোগ করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. একটি GracePeriod.Listener তৈরি করুন এবং সেই ইভেন্টগুলি পরিচালনা করতে onGracePeriodEnd() এবং onGracePeriodCancel() প্রয়োগ করুন৷
  3. একটি Slider.GracePeriod তৈরি করুন এবং startGracePeriod() পদ্ধতিতে GracePeriod.Listener পাস করে অ্যানিমেশন শুরু করুন।
  4. সোয়াইপ ডাউন অঙ্গভঙ্গি পরিচালনা করতে কার্যকলাপের onBackPressed() ওভাররাইড করুন।
  5. যদি ব্যবহারকারী নিচের দিকে সোয়াইপ করেন, তাহলে স্লাইডারটিকে বাতিল করতে Slider.GracePeriodcancel() কল করুন।

নিম্নলিখিত উদাহরণে, গ্রেস পিরিয়ড স্ক্রলারটি এমন একজন শ্রোতার সাথে শুরু করা হয়েছে যা পিরিয়ড শেষ হলে একটি সফল শব্দ বাজাবে এবং গ্রেস পিরিয়ড স্লাইডার বাতিল হলে একটি খারিজ শব্দ হবে:

public final class SliderActivity extends Activity {

    ...
    private Slider.GracePeriod mGracePeriod;

    private final GracePeriod.Listener mGracePeriodListener =
        new GracePeriod.Listener() {

        @Override
        public void onGracePeriodEnd() {
            // Play a SUCCESS sound to indicate the end of the grace period.
            AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
            am.playSoundEffect(Sounds.SUCCESS);
            mGracePeriod = null;
        }

        @Override
        public void onGracePeriodCancel() {
            // Play a DIMISS sound to indicate the cancellation of the grace period.
            AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
            am.playSoundEffect(Sounds.DISMISSED);
            mGracePeriod = null;
        }
    };

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                mGracePeriod = mSlider.startGracePeriod(mGracePeriodListener);
            }
        });

        setContentView(mCardScroller);
    }

    @Override
    public void onBackPressed() {
        // If the Grace Period is running,
        // cancel it instead of finishing the Activity.
        if (mGracePeriod != null) {
            mGracePeriod.cancel();
        } else {
            super.onBackPressed();
        }
    }
}

স্লাইডার নির্ধারণ করুন

ডিটারমিনেট স্লাইডারগুলি মূলত অগ্রগতি দেখানোর জন্য ব্যবহৃত হয় যেখানে আপনি একটি কাজ শেষ হলে গণনা করতে পারেন। আপনি Slider.Determinate ব্যবহার করে এই অ্যানিমেশন যোগ করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. স্লাইডার তৈরি করুন। startScroller() ব্যবহার করে Slider.Determinate এবং সর্বোচ্চ এবং প্রাথমিক অবস্থান নির্ধারণ করুন।
  3. অ্যানিমেশন শেষ হলে, Slider.Determinate hide() পদ্ধতিতে কল করুন। স্লাইডারটি লুকানোর জন্য নির্ধারণ করুন।

এখানে একটি সাধারণ বাস্তবায়ন যা ব্যবহারকারী ট্যাপ করলে স্ক্রলারটিকে একটি সেট অবস্থানে অ্যানিমেট করে:

public final class SliderActivity extends Activity {

    ...
    private Slider.Determinate mDeterminate;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                   int position, long id) {
                mDeterminate = mSlider.startDeterminate(MAX_SLIDER_VALUE, 0);
                ObjectAnimator animator = ObjectAnimator.ofFloat(mDeterminate,
                    "position", 0, MAX_SLIDER_VALUE);

                // Hide the slider when the animation stops.
                animator.addListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        mDeterminate.hide();
                    }
                });

                // Start an animation showing the different positions of the slider.
                animator.setDuration(ANIMATION_DURATION_MILLIS).start();
            }
        });

        setContentView(mCardScroller);
    }
}

অনির্ধারিত স্লাইডার

অনির্দিষ্ট স্লাইডারগুলি স্ক্রিন লোড করার জন্য ব্যবহার করা যেতে পারে যেখানে কাজ শেষ হলে গণনা করা কঠিন। আপনি Slider.Indeterminate ব্যবহার করে এই অ্যানিমেশন যোগ করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. Slider.startIndeterminate() পদ্ধতি দিয়ে অ্যানিমেশন শুরু করুন।
  3. আপনি অ্যানিমেশন বন্ধ করার জন্য প্রস্তুত হলে, Slider.Indeterminatehide() পদ্ধতিতে কল করুন।

এখানে একটি সাধারণ বাস্তবায়ন যা ব্যবহারকারী যখন কার্ডটি ট্যাপ করে তখন অনির্দিষ্ট স্ক্রলার তৈরি করে এবং ব্যবহারকারী আবার ট্যাপ করলে এটি লুকিয়ে রাখে:

public final class SliderActivity extends Activity {

    ...
    private Slider.Indeterminate mIndeterminate;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                   int position, long id) {
                // Toggle between showing/hiding the indeterminate slider.
                if (mIndeterminate != null) {
                    mIndeterminate.hide();
                    mIndeterminate = null;
                } else {
                    mIndeterminate = mSlider.startIndeterminate();
                }
        });

        setContentView(mCardScroller);
    }
}
,

আপনি স্লাইডার ব্যবহার করতে পারেন স্ক্রিনের নীচে একটি লোডিং, অগ্রগতি বা নেভিগেশন বার দেখাতে। স্লাইডারগুলি হল বিশ্বব্যাপী UX উপাদান এবং আপনার গ্লাসওয়্যারে এগুলি প্রয়োগ করার সময় যত্ন সহকারে আচরণ করা উচিত।


স্ক্রোলার স্লাইডার

আপনি একাধিক কার্ডের মাধ্যমে সোয়াইপ করার সাথে সাথে একটি কার্ডের অবস্থান নির্দেশ করতে স্ক্রলার স্লাইডার ব্যবহার করা হয়। আপনি Slider.Scroller ব্যবহার করে একই ধরনের প্রভাব তৈরি করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. startScroller() ব্যবহার করে Slider.Scroller তৈরি করুন এবং সর্বোচ্চ এবং প্রাথমিক অবস্থান নির্ধারণ করুন।

এখানে একটি সাধারণ বাস্তবায়ন যা ব্যবহারকারী ট্যাপ করলে একটি স্ক্রলারকে পরবর্তী অবস্থানে অ্যানিমেট করে:

public final class SliderActivity extends Activity {

    private static final int MAX_SLIDER_VALUE = 5;
    private static final long ANIMATION_DURATION_MILLIS = 5000;

    private CardScrollView mCardScroller;
    private Slider mSlider;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                processSliderRequest(position+1);
            }
        });

        setContentView(mCardScroller);
    }

    private void processSliderRequest(position) {
        Slider.Scroller scroller = mSlider.startScroller(MAX_SLIDER_VALUE, 0);

        // Animate the slider to the next position. The slider
        // automatically hides after the duration has elapsed
        ObjectAnimator.ofFloat(scroller, "position", 0, position)
            .setDuration(ANIMATION_DURATION_MILLIS)
            .start();
    }
}

গ্রেস পিরিয়ড স্লাইডার

গ্রেস পিরিয়ড স্লাইডারগুলি এমন ক্রিয়াকলাপে কাজ করে যেখানে এটি একটি ব্যবহারকারীর জন্য একটি বিজ্ঞপ্তি দেখতে উপযোগী, তবে ব্যবহারকারীর মিথস্ক্রিয়া প্রয়োজন হয় না। আপনি Slider.GracePeriod ব্যবহার করে এই অ্যানিমেশন যোগ করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. একটি GracePeriod.Listener তৈরি করুন এবং সেই ইভেন্টগুলি পরিচালনা করতে onGracePeriodEnd() এবং onGracePeriodCancel() প্রয়োগ করুন৷
  3. একটি Slider.GracePeriod তৈরি করুন এবং startGracePeriod() পদ্ধতিতে GracePeriod.Listener পাস করে অ্যানিমেশন শুরু করুন।
  4. সোয়াইপ ডাউন অঙ্গভঙ্গি পরিচালনা করতে কার্যকলাপের onBackPressed() ওভাররাইড করুন।
  5. যদি ব্যবহারকারী নিচের দিকে সোয়াইপ করেন, তাহলে স্লাইডারটিকে বাতিল করতে Slider.GracePeriodcancel() কল করুন।

নিম্নলিখিত উদাহরণে, গ্রেস পিরিয়ড স্ক্রলারটি এমন একজন শ্রোতার সাথে শুরু করা হয়েছে যা পিরিয়ড শেষ হলে একটি সফল শব্দ বাজাবে এবং গ্রেস পিরিয়ড স্লাইডার বাতিল হলে একটি খারিজ শব্দ হবে:

public final class SliderActivity extends Activity {

    ...
    private Slider.GracePeriod mGracePeriod;

    private final GracePeriod.Listener mGracePeriodListener =
        new GracePeriod.Listener() {

        @Override
        public void onGracePeriodEnd() {
            // Play a SUCCESS sound to indicate the end of the grace period.
            AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
            am.playSoundEffect(Sounds.SUCCESS);
            mGracePeriod = null;
        }

        @Override
        public void onGracePeriodCancel() {
            // Play a DIMISS sound to indicate the cancellation of the grace period.
            AudioManager am = (AudioManager) getSystemService(Context.AUDIO_SERVICE);
            am.playSoundEffect(Sounds.DISMISSED);
            mGracePeriod = null;
        }
    };

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                    int position, long id) {
                mGracePeriod = mSlider.startGracePeriod(mGracePeriodListener);
            }
        });

        setContentView(mCardScroller);
    }

    @Override
    public void onBackPressed() {
        // If the Grace Period is running,
        // cancel it instead of finishing the Activity.
        if (mGracePeriod != null) {
            mGracePeriod.cancel();
        } else {
            super.onBackPressed();
        }
    }
}

স্লাইডার নির্ধারণ করুন

ডিটারমিনেট স্লাইডারগুলি মূলত অগ্রগতি দেখানোর জন্য ব্যবহৃত হয় যেখানে আপনি একটি কাজ শেষ হলে গণনা করতে পারেন। আপনি Slider.Determinate ব্যবহার করে এই অ্যানিমেশন যোগ করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. স্লাইডার তৈরি করুন। startScroller() ব্যবহার করে Slider.Determinate এবং সর্বোচ্চ এবং প্রাথমিক অবস্থান নির্ধারণ করুন।
  3. অ্যানিমেশন শেষ হলে, Slider.Determinate hide() পদ্ধতিতে কল করুন। স্লাইডারটি লুকানোর জন্য নির্ধারণ করুন।

এখানে একটি সাধারণ বাস্তবায়ন যা ব্যবহারকারী ট্যাপ করলে স্ক্রলারটিকে একটি সেট অবস্থানে অ্যানিমেট করে:

public final class SliderActivity extends Activity {

    ...
    private Slider.Determinate mDeterminate;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                   int position, long id) {
                mDeterminate = mSlider.startDeterminate(MAX_SLIDER_VALUE, 0);
                ObjectAnimator animator = ObjectAnimator.ofFloat(mDeterminate,
                    "position", 0, MAX_SLIDER_VALUE);

                // Hide the slider when the animation stops.
                animator.addListener(new AnimatorListenerAdapter() {
                    @Override
                    public void onAnimationEnd(Animator animation) {
                        mDeterminate.hide();
                    }
                });

                // Start an animation showing the different positions of the slider.
                animator.setDuration(ANIMATION_DURATION_MILLIS).start();
            }
        });

        setContentView(mCardScroller);
    }
}

অনির্ধারিত স্লাইডার

অনির্দিষ্ট স্লাইডারগুলি স্ক্রিন লোড করার জন্য ব্যবহার করা যেতে পারে যেখানে কাজ শেষ হলে গণনা করা কঠিন। আপনি Slider.Indeterminate ব্যবহার করে এই অ্যানিমেশন যোগ করতে পারেন।

  1. একটি Slider তৈরি করতে Slider.from() ব্যবহার করুন যা স্লাইডার প্রদর্শনের জন্য একটি View ব্যবহার করে।
  2. Slider.startIndeterminate() পদ্ধতি দিয়ে অ্যানিমেশন শুরু করুন।
  3. আপনি অ্যানিমেশন বন্ধ করার জন্য প্রস্তুত হলে, Slider.Indeterminatehide() পদ্ধতিতে কল করুন।

এখানে একটি সাধারণ বাস্তবায়ন যা ব্যবহারকারী যখন কার্ডটি ট্যাপ করে তখন অনির্দিষ্ট স্ক্রলার তৈরি করে এবং ব্যবহারকারী আবার ট্যাপ করলে এটি লুকিয়ে রাখে:

public final class SliderActivity extends Activity {

    ...
    private Slider.Indeterminate mIndeterminate;

    @Override
    protected void onCreate(Bundle bundle) {
        super.onCreate(bundle);

        // Create the cards for the view
        mCardScroller = new CardScrollView(this);
        mCardScroller.setAdapter(new CardAdapter(createCards()));

        // Set the view for the Slider
        mSlider = Slider.from(mCardScroller);

        mCardScroller.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> parent, View view,
                   int position, long id) {
                // Toggle between showing/hiding the indeterminate slider.
                if (mIndeterminate != null) {
                    mIndeterminate.hide();
                    mIndeterminate = null;
                } else {
                    mIndeterminate = mSlider.startIndeterminate();
                }
        });

        setContentView(mCardScroller);
    }
}