এই পৃষ্ঠাটি 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>

যদি সাপোর্ট লাইব্রেরি ভার্সনটি ২৬.০.০ এর চেয়ে নতুন হয়, তাহলে 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 রিসোর্স হিসাবে সংজ্ঞায়িত করা হয়:

বোতামের ধরণ	বিবরণ
`@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 ওভাররাইড করুন এবং getButtonImageViewAt(int) কল করে সেই কাস্টম বোতামের জন্য ImageView পান। তারপর bindViewToUIController(View, UIController) কল করে ভিউটি আপনার কাস্টম 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 ব্যবহার করে একটি কাস্টম বোতাম রাখার জন্য একটি স্লট নির্দিষ্ট করুন। তারপর আপনি getButtonImageViewAt(int) ব্যবহার করে সেই কাস্টম বোতামের জন্য ImageView পেতে পারেন।
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 পরীক্ষা