এই পৃষ্ঠাটি Cloud Translation API অনুবাদ করেছে।

অ্যান্ড্রয়েড প্রেরক UI কাস্টমাইজ করুন

আপনি রং নির্ধারণ করে, বাটন, টেক্সট ও থাম্বনেইলের চেহারা স্টাইল করে এবং প্রদর্শিত বাটনের ধরন বেছে নিয়ে কাস্ট উইজেটগুলো কাস্টমাইজ করতে পারেন।

অ্যাপের থিম কাস্টমাইজ করুন

এই উদাহরণটি Theme.CastVideosTheme একটি কাস্টম থিম স্টাইল তৈরি করে, যা কাস্টম রং, একটি সূচনা ওভারলে স্টাইল, একটি মিনি কন্ট্রোলার স্টাইল এবং একটি বর্ধিত কন্ট্রোলার স্টাইল নির্ধারণ করতে পারে।

<style name="Theme.CastVideosTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Set AppCompat's color theming attrs -->
    <item name="colorPrimary">@color/primary</item>
    <item name="colorPrimaryDark">@color/primary_dark</item>
    <item name="colorAccent">@color/accent</item>
    <item name="android:textColorPrimary">@color/primary_text</item>
    <item name="android:textColorSecondary">@color/secondary_text</item>
    <item name="castIntroOverlayStyle">@style/CustomCastIntroOverlay</item>
    <item name="castMiniControllerStyle">@style/CustomCastMiniController</item>
    <item name="castExpandedControllerStyle">@style/CustomCastExpandedController</item>
</style>

উপরের শেষ তিনটি লাইন আপনাকে এই থিমের অংশ হিসেবে ইন্ট্রোডাক্টরি ওভারলে, মিনি কন্ট্রোলার এবং এক্সপান্ডেড কন্ট্রোলারের জন্য নির্দিষ্ট স্টাইল নির্ধারণ করতে সক্ষম করে। এর পরের বিভাগগুলোতে উদাহরণ অন্তর্ভুক্ত করা হয়েছে।

কাস্ট বাটন কাস্টমাইজ করুন

আপনার অ্যাপের থিমে একটি কাস্টম mediaRouteTheme যোগ করতে:

<style name="Theme.CastVideosTheme" parent="Theme.AppCompat.Light.NoActionBar">
  <!-- ... -->
  <item name="mediaRouteTheme">@style/CustomMediaRouterTheme</item>
</style>

আপনার নিজস্ব মিডিয়া রাউটার থিম ঘোষণা করুন এবং একটি নিজস্ব mediaRouteButtonStyle ঘোষণা করুন:

<style name="CustomMediaRouterTheme" parent="Theme.MediaRouter">
  <item name="mediaRouteButtonStyle">@style/CustomMediaRouteButtonStyle</item>
</style>

<style name="CustomMediaRouteButtonStyle" parent="Widget.MediaRouter.Light.MediaRouteButton">
  <item name="mediaRouteButtonTint">#EEFF41</item>
</style>

সাপোর্ট লাইব্রেরির ভার্সন 26.0.0-এর চেয়ে নতুন হলে setTint ব্যবহার করা উচিত। পুরোনো সাপোর্ট লাইব্রেরি ভার্সনগুলোর জন্য, এর পরিবর্তে buttonTint ব্যবহার করুন।

ভূমিকা ওভারলে থিম কাস্টমাইজ করুন

IntroductoryOverlay ক্লাসটি বিভিন্ন স্টাইল অ্যাট্রিবিউট সমর্থন করে, যা আপনার অ্যাপ একটি কাস্টম থিমে ওভাররাইড করতে পারে। এই উদাহরণটি দেখায় কিভাবে ওভারলে উইজেটের উপর বাটন এবং টাইটেল উভয়ের টেক্সটের চেহারা ওভাররাইড করতে হয়:

<style name="CustomCastIntroOverlay" parent="CastIntroOverlay">
    <item name="castButtonTextAppearance">@style/TextAppearance.CustomCastIntroOverlay.Button</item>
    <item name="castTitleTextAppearance">@style/TextAppearance.CustomCastIntroOverlay.Title</item>
</style>
<style name="TextAppearance.CustomCastIntroOverlay.Button" parent="android:style/TextAppearance">
    <item name="android:textColor">#FFFFFF</item>
</style>
<style name="TextAppearance.CustomCastIntroOverlay.Title"parent="android:style/TextAppearance.Large">
    <item name="android:textColor">#FFFFFF</item>
</style>

মিনি কন্ট্রোলার কাস্টমাইজ করুন

থিম কাস্টমাইজ করুন

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

<style name="CustomCastMiniController" parent="CastMiniController">
    <item name="castShowImageThumbnail">true</item>
    <item name="castTitleTextAppearance">@style/TextAppearance.AppCompat.Subhead</item>
    <item name="castSubtitleTextAppearance">@style/TextAppearance.AppCompat.Caption</item>
    <item name="castBackground">#FFFFFF</item>
    <item name="castProgressBarColor">#FFFFFF</item>
    <item name="castPlayButtonDrawable">@drawable/cast_ic_mini_controller_play</item>
    <item name="castPauseButtonDrawable">@drawable/cast_ic_mini_controller_pause</item>
    <item name="castStopButtonDrawable">@drawable/cast_ic_mini_controller_stop</item>
    <item name="castLargePlayButtonDrawable">@drawable/cast_ic_mini_controller_play_large</item>
    <item name="castLargePauseButtonDrawable">@drawable/cast_ic_mini_controller_pause_large</item>
    <item name="castLargeStopButtonDrawable">@drawable/cast_ic_mini_controller_stop_large</item>
    <item name="castSkipPreviousButtonDrawable">@drawable/cast_ic_mini_controller_skip_prev</item>
    <item name="castSkipNextButtonDrawable">@drawable/cast_ic_mini_controller_skip_next</item>
    <item name="castRewind30ButtonDrawable">@drawable/cast_ic_mini_controller_rewind30</item>
    <item name="castForward30ButtonDrawable">@drawable/cast_ic_mini_controller_forward30</item>
    <item name="castMuteToggleButtonDrawable">@drawable/cast_ic_mini_controller_mute</item>
    <item name="castClosedCaptionsButtonDrawable">@drawable/cast_ic_mini_controller_closed_caption</item
</style>

বোতাম বেছে নিন

একটি MiniControllerFragment তিনটি স্লট থাকে যেগুলোতে অ্যালবাম আর্ট এবং দুটি বাটন দেখানো যায়, অথবা অ্যালবাম আর্ট না থাকলে তিনটি কন্ট্রোল বাটন থাকে।

SLOT  SLOT  SLOT
  1     2     3

ডিফল্টরূপে ফ্র্যাগমেন্টটি একটি প্লে/পজ টগল বাটন দেখায়। ডেভেলপাররা কোন বাটনগুলো দেখানো হবে তা ওভাররাইড করতে castControlButtons অ্যাট্রিবিউটটি ব্যবহার করতে পারেন। সমর্থিত কন্ট্রোল বাটনগুলো `ID resources` হিসেবে সংজ্ঞায়িত করা আছে।

বোতামের ধরন	বর্ণনা
`@id/cast_button_type_empty`	এই স্লটে কোনো বাটন রাখবেন না।
`@id/cast_button_type_custom`	কাস্টম বোতাম
`@id/cast_button_type_play_pause_toggle`	প্লেব্যাক এবং পজের মধ্যে পরিবর্তন করে
`@id/cast_button_type_skip_previous`	সারিতে থাকা পূর্ববর্তী আইটেমে চলে যায়।
`@id/cast_button_type_skip_next`	সারিতে থাকা পরবর্তী আইটেমে চলে যায়
`@id/cast_button_type_rewind_30_seconds`	প্লেব্যাক ৩০ সেকেন্ড পিছিয়ে দেয়
`@id/cast_button_type_forward_30_seconds`	প্লেব্যাকটি ৩০ সেকেন্ড এগিয়ে দেয়
`@id/cast_button_type_mute_toggle`	রিসিভারকে মিউট এবং আনমিউট করে
`@id/cast_button_type_closed_caption`	টেক্সট এবং অডিও ট্র্যাক নির্বাচন করার জন্য একটি ডায়ালগ বক্স খোলে।

এখানে একটি উদাহরণ দেওয়া হল যেখানে বাম থেকে ডানে ক্রমানুসারে অ্যালবাম আর্ট, একটি প্লে/পজ টগল বাটন এবং একটি স্কিপ ফরওয়ার্ড বাটন ব্যবহার করা হবে:

<array name="cast_mini_controller_control_buttons">
    <item>@id/cast_button_type_empty</item>
    <item>@id/cast_button_type_play_pause_toggle</item>
    <item>@id/cast_button_type_forward_30_seconds</item>
</array>
...
<fragment
    android:id="@+id/cast_mini_controller"
    ...
    app:castControlButtons="@array/cast_mini_controller_control_buttons"
    class="com.google.android.gms.cast.framework.media.widget.MiniControllerFragment">

সতর্কীকরণ : এই অ্যারেতে অবশ্যই ঠিক তিনটি আইটেম থাকতে হবে, অন্যথায় একটি রানটাইম এক্সেপশন থ্রো করা হবে। যদি আপনি কোনো স্লটে বাটন দেখাতে না চান, তাহলে @id/cast_button_type_empty ব্যবহার করুন।

কাস্টম বোতাম যোগ করুন

একটি MiniControllerFragment মাধ্যমে SDK-তে অন্তর্ভুক্ত নয় এমন কাস্টম কন্ট্রোল বাটন, যেমন একটি "থাম্বস আপ" বাটন, যোগ করা যায়। এর ধাপগুলো হলো:

MiniControllerFragment এর castControlButtons অ্যাট্রিবিউটে @id/cast_button_type_custom ব্যবহার করে একটি কাস্টম বাটন ধারণ করার জন্য একটি স্লট নির্দিষ্ট করুন।
UIController এর একটি সাবক্লাস তৈরি করুন। UIController এ এমন কিছু মেথড থাকে, যেগুলো কাস্ট সেশন বা মিডিয়া সেশনের স্টেট পরিবর্তিত হলে SDK দ্বারা কল করা হয়। আপনার UIController সাবক্লাসটি প্যারামিটারগুলোর মধ্যে একটি হিসেবে একটি ImageView গ্রহণ করবে এবং প্রয়োজন অনুযায়ী এর স্টেট আপডেট করবে।
MiniControllerFragment সাবক্লাস করুন, তারপর onCreateView ওভাররাইড করুন এবং ঐ কাস্টম বাটনের জন্য ImageView পেতে getButtonImageViewAt(int) কল করুন। এরপর, ভিউটিকে আপনার কাস্টম UIController সাথে যুক্ত করতে bindViewToUIController(View, UIController) কল করুন।
আপনার কাস্টম বাটন থেকে অ্যাকশনটি কীভাবে পরিচালনা করবেন তা জানতে 'Add Custom Actions'- এর অধীনে MediaIntentReceiver দেখুন।
এখানে MyCustomUIController নামক একটি UIController এর সাথে স্লট ২-এ একটি বাটন যুক্ত করার একটি উদাহরণ দেওয়া হলো:

// arrays.xml
<array name="cast_expanded_controller_control_buttons">
    <item>@id/cast_button_type_empty</item>
    <item>@id/cast_button_type_rewind_30_seconds</item>
    <item>@id/cast_button_type_custom</item>
    <item>@id/cast_button_type_empty</item>
</array>

কোটলিন

// MyCustomUIController.kt
class MyCustomUIController(private val mView: View) : UIController() {
    override fun onMediaStatusUpdated() {
        // Update the state of mView based on the latest the media status.
        ...
        mView.visibility = View.INVISIBLE
        ...
    }
}

// MyMiniControllerFragment.kt
class MyMiniControllerFragment : MiniControllerFragment() {
    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {
        super.onCreateView(inflater, container, savedInstanceState)
        val customButtonView = getButtonImageViewAt(2)
        val myCustomUiController = MyCustomUIController(customButtonView)
        uiMediaController.bindViewToUIController(customButtonView, myCustomUiController)
        ...
    }
}

জাভা

// MyCustomUIController.java
class MyCustomUIController extends UIController {
    private final View mView;

    public MyCustomUIController(View view) {
            mView = view;
    }

    @Override
    public onMediaStatusUpdated() {
        // Update the state of mView based on the latest the media status.
        ...
        mView.setVisibility(View.INVISIBLE);
        ...
    }
}

// MyMiniControllerFragment.java
class MyMiniControllerFragment extends MiniControllerFragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        super.onCreateView(inflater, container, savedInstanceState);
        ImageView customButtonView = getButtonImageViewAt(2);
        MyCustomUIController myCustomUiController = new MyCustomUIController(customButtonView);
        getUIMediaController().bindViewToUIController(customButtonView, myCustomUiController);
        ...
    }
}

বর্ধিত কন্ট্রোলার কাস্টমাইজ করুন

থিম কাস্টমাইজ করুন

যদি কোনো এক্সপান্ডেড কন্ট্রোলারের অ্যাক্টিভিটিতে ডার্ক থিম টুলবার ব্যবহৃত হয়, তাহলে আপনি টুলবারে হালকা টেক্সট এবং হালকা আইকন কালার ব্যবহার করার জন্য একটি থিম সেট করতে পারেন:

<style name="Theme.CastVideosTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="castExpandedControllerToolbarStyle">
        @style/ThemeOverlay.AppCompat.Dark.ActionBar
    </item>
</style>

আপনি প্রসারিত কন্ট্রোলারে বাটনগুলো আঁকার জন্য আপনার নিজস্ব ছবি নির্দিষ্ট করে দিতে পারেন:

<style name="CustomCastExpandedController" parent="CastExpandedController">
    <item name="castButtonColor">@null</item>
    <item name="castPlayButtonDrawable">@drawable/cast_ic_expanded_controller_play</item>
    <item name="castPauseButtonDrawable">@drawable/cast_ic_expanded_controller_pause</item>
    <item name="castStopButtonDrawable">@drawable/cast_ic_expanded_controller_stop</item>
    <item name="castSkipPreviousButtonDrawable">@drawable/cast_ic_expanded_controller_skip_previous</item>
    <item name="castSkipNextButtonDrawable">@drawable/cast_ic_expanded_controller_skip_next</item>
    <item name="castRewind30ButtonDrawable">@drawable/cast_ic_expanded_controller_rewind30</item>
    <item name="castForward30ButtonDrawable">@drawable/cast_ic_expanded_controller_forward30</item>
</style>

বোতাম বেছে নিন

বর্ধিত কন্ট্রোলারের অ্যাক্টিভিটিতে কন্ট্রোল বাটন দেখানোর জন্য পাঁচটি স্লট রয়েছে। মাঝের স্লটটিতে সবসময় একটি প্লে/পজ টগল বাটন দেখা যায় এবং এটি কনফিগার করা যায় না। অন্য চারটি স্লট প্রেরক অ্যাপের মাধ্যমে বাম থেকে ডানে কনফিগার করা যায়।

SLOT  SLOT  PLAY/PAUSE  SLOT  SLOT
  1     2     BUTTON      3     4

ডিফল্টরূপে অ্যাক্টিভিটিটি বাম থেকে ডানে এই চারটি স্লটে একটি ক্লোজড ক্যাপশন বাটন, আগের আইটেমে যাওয়ার বাটন, পরের আইটেমে যাওয়ার বাটন এবং একটি মিউট টগল বাটন প্রদর্শন করে। ডেভেলপাররা কোন স্লটে কোন বাটন দেখানো হবে তা ওভাররাইড করতে castControlButtons অ্যাট্রিবিউটটি ব্যবহার করতে পারেন। সমর্থিত কন্ট্রোল বাটনগুলোর তালিকা মিনি কন্ট্রোলার বাটনের বাটন টাইপের অনুরূপ আইডি রিসোর্স হিসেবে সংজ্ঞায়িত করা হয়েছে।

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

// arrays.xml
<array name="cast_expanded_controller_control_buttons">
    <item>@id/cast_button_type_empty</item>
    <item>@id/cast_button_type_rewind_30_seconds</item>
    <item>@id/cast_button_type_forward_30_seconds</item>
    <item>@id/cast_button_type_empty</item>
</array>
...
// styles.xml
<style name="Theme.MyTheme">
    <item name="castExpandedControllerStyle">
        @style/CustomCastExpandedController
    </item>
</style>
...
<style name="CustomCastExpandedController" parent="CastExpandedController">
    <item name="castControlButtons">
        @array/cast_expanded_controller_control_buttons
    </item>
</style>

অ্যারেটিতে অবশ্যই ঠিক চারটি আইটেম থাকতে হবে, অন্যথায় একটি রানটাইম এক্সেপশন থ্রো করা হবে। যদি আপনি কোনো স্লটে বাটন দেখাতে না চান, তাহলে @id/cast_button_type_empty ব্যবহার করুন। CastContext এই অ্যাক্টিভিটির লাইফসাইকেল এবং প্রেজেন্টেশন পরিচালনা করতে পারে।

কাস্টম বোতাম যোগ করুন

একটি ExpandedControllerActivity এমন কাস্টম কন্ট্রোল বাটন যোগ করা সমর্থন করে যা SDK দ্বারা সরবরাহ করা হয় না, যেমন একটি "থাম্বস আপ" বাটন। এর ধাপগুলো হলো:

ExpandedControllerActivity এর castControlButtons অ্যাট্রিবিউটে @id/cast_button_type_custom ব্যবহার করে একটি কাস্টম বাটন ধারণ করার জন্য একটি স্লট নির্দিষ্ট করুন। এরপর আপনি সেই কাস্টম বাটনের ImageView পাওয়ার জন্য getButtonImageViewAt(int) ব্যবহার করতে পারেন।
UIController এর একটি সাবক্লাস তৈরি করুন। UIController এমন কিছু মেথড থাকে, যেগুলো কাস্ট সেশন বা মিডিয়া সেশনের স্টেট পরিবর্তিত হলে SDK দ্বারা কল করা হয়। আপনার UIController সাবক্লাসটি প্যারামিটারগুলোর মধ্যে একটি হিসেবে একটি ImageView গ্রহণ করবে এবং প্রয়োজন অনুযায়ী এর স্টেট আপডেট করবে।
ExpandedControllerActivity-কে সাবক্লাস করুন, তারপর onCreate ওভাররাইড করুন এবং বাটনের ভিউ অবজেক্টটি পেতে getButtonImageViewAt(int) কল করুন। এরপর, ভিউটিকে আপনার কাস্টম UIController সাথে যুক্ত করতে bindViewToUIController(View, UIController) কল করুন।
আপনার কাস্টম বাটন থেকে অ্যাকশনটি কীভাবে পরিচালনা করবেন তা জানতে 'Add Custom Actions'- এর অধীনে MediaIntentReceiver দেখুন।

এখানে MyCustomUIController নামক একটি UIController এর সাথে স্লট ২-এ একটি বাটন যুক্ত করার একটি উদাহরণ দেওয়া হলো:

// arrays.xml
<array name="cast_expanded_controller_control_buttons">
    <item>@id/cast_button_type_empty</item>
    <item>@id/cast_button_type_rewind_30_seconds</item>
    <item>@id/cast_button_type_custom</item>
    <item>@id/cast_button_type_empty</item>
</array>

কোটলিন

// MyCustomUIController.kt
class MyCustomUIController(private val mView: View) : UIController() {
    override fun onMediaStatusUpdated() {
        // Update the state of mView based on the latest the media status.
        ...
        mView.visibility = View.INVISIBLE
        ...
    }
}

// MyExpandedControllerActivity.kt
internal class MyExpandedControllerActivity : ExpandedControllerActivity() {
    public override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val customButtonView = getButtonImageViewAt(2)
        val myCustomUiController = MyCustomUIController(customButtonView)
        uiMediaController.bindViewToUIController(customButtonView, myCustomUiController)
        ...
    }
}

জাভা

// MyCustomUIController.java
class MyCustomUIController extends UIController {
    private final View mView;

    public MyCustomUIController(View view) {
        mView = view;
    }

    @Override
    public onMediaStatusUpdated() {
        // Update the state of mView based on the latest the media status.
        ...
        mView.setVisibility(View.INVISIBLE);
        ...
    }
}

// MyExpandedControllerActivity.java
class MyExpandedControllerActivity extends ExpandedControllerActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        ImageView customButtonView = getButtonImageViewAt(2);
        MyCustomUIController myCustomUiController = new MyCustomUIController(customButtonView);
        getUIMediaController().bindViewToUIController(customButtonView, myCustomUiController);
        ...
    }
}

পূর্ববর্তী

ইন্টিগ্রেট কাস্ট, ইন্টিগ্রেট কাস্ট

পরবর্তী

স্বয়ংক্রিয় UI পরীক্ষা, স্বয়ংক্রিয় UI পরীক্ষা