Change Chromecast casting icon color

问题

I'm using Google's method to add a Cast button to my app, but it's defaulted to the white icon, which is invisible against my white menu bar. How do I go about changing the color of the Cast icon to black?

回答1:

If it is just due to the style (dark vs light), you should be fine if the style is defined correctly (i.e. extending the right theme in terms of dark vs light). For general styling, check out this post and if that doesn't solve your issue, come back and let us know.

回答2:

I've just extended MediaRouteActionProvider like this:

public class ThemeableMediaRouteActionProvider extends MediaRouteActionProvider {
   public ThemeableMediaRouteActionProvider(Context context) {
       super(context);
   }

   @Override
   public MediaRouteButton onCreateMediaRouteButton() {
       MediaRouteButton button = super.onCreateMediaRouteButton();
       colorWorkaroundForCastIcon(button);
       return button;
   }

   @Nullable
   @Override
   public MediaRouteButton getMediaRouteButton() {
      MediaRouteButton button = super.getMediaRouteButton();
      colorWorkaroundForCastIcon(button);
      return button;
   }

   private void colorWorkaroundForCastIcon(MediaRouteButton button) {
      if (button == null) return;
      Context castContext = new ContextThemeWrapper(getContext(), android.support.v7.mediarouter.R.style.Theme_MediaRouter);

      TypedArray a = castContext.obtainStyledAttributes(null,
           android.support.v7.mediarouter.R.styleable.MediaRouteButton, android.support.v7.mediarouter.R.attr.mediaRouteButtonStyle, 0);
      Drawable drawable = a.getDrawable(android.support.v7.mediarouter.R.styleable.MediaRouteButton_externalRouteEnabledDrawable);
      a.recycle();
      DrawableCompat.setTint(drawable, getContext().getResources().getColor(R.color.primary));
      drawable.setState(button.getDrawableState());
      button.setRemoteIndicatorDrawable(drawable);
   }
}

R.color.primary is what color i wanted.

then just replace actionProviderClass in menu from MediaRouteActionProvider to your like that:

<item
    android:id="@+id/media_route_menu_item"
    android:title="@string/media_route_menu_title"
    bwq:actionProviderClass="tv.test.playback.chromecast.ThemeableMediaRouteActionProvider"
    bwq:showAsAction="always">
</item>

回答3:

I extended MediaRouteButton. See code below. Then I can just call applyTint() and it applies the color to all states of the RemoteIndicatorDrawable

public class ColorableMediaRouteButton extends MediaRouteButton {

    protected Drawable mRemoteIndicatorDrawable;

    public ColorableMediaRouteButton(Context context) {
        super(context);
    }

    public ColorableMediaRouteButton(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    public ColorableMediaRouteButton(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
    }

    @Override
    public void setRemoteIndicatorDrawable(Drawable d) {
        mRemoteIndicatorDrawable = d;
        super.setRemoteIndicatorDrawable(d);
    }

    public void applyTint(int color) {
        Drawable wrapDrawable = DrawableCompat.wrap(mRemoteIndicatorDrawable);
        DrawableCompat.setTint(wrapDrawable, color);
    }
}

回答4:

I experienced this issue myself, and solved it by changing the android:theme and app:popuptheme values to @style/ThemeOverlay.AppCompat.Dark.ActionBar.

See example code below:

<android.support.v7.widget.Toolbar
        android:id="@+id/my_toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="#4dffffff"
        android:elevation="4dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        app:popupTheme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

回答5:

If you have a one color for the cast icon for a view use a theme for the fragment or activity.

<item name="mediaRouteButtonTint">@color/red</item>

If you want to programmatically set the color use the following code.

<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/menu_item"
        android:title="@string/media_route_menu_title"
        app:actionProviderClass="androidx.mediarouter.app.MediaRouteActionProvider" />
</menu>

import androidx.core.content.ContextCompat
import androidx.appcompat.view.ContextThemeWrapper
import androidx.core.graphics.drawable.DrawableCompat

...

override fun onCreateOptionsMenu(menu: Menu, inflater: MenuInflater?) {
    val tintColor = ContextCompat.getColor(context, R.color.my_color)
    val item = menu.findItem(R.id.menu_item)
    val button = item.actionView
    val castContext = ContextThemeWrapper(context, androidx.mediarouter.R.style.Theme_MediaRouter)
    val attrs = castContext.obtainStyledAttributes(null, androidx.mediarouter.R.styleable.MediaRouteButton, androidx.mediarouter.R.attr.mediaRouteButtonStyle, 0)
    val drawable = attrs.getDrawable(androidx.mediarouter.R.styleable.MediaRouteButton_externalRouteEnabledDrawable)
    attrs.recycle()
    DrawableCompat.setTint(drawable, tintColor)
    drawable.state = button.getDrawableState()
    button.setRemoteIndicatorDrawable(drawable)

回答6:

Absolutely simple answer's here:

https://developers.google.com/cast/docs/android_sender_advanced#customize_cast_button

So just copy mediaRouteTheme from that link to your app's theme and next two styles to the styles.xml.

回答7:

The official answer is here:

https://developers.google.com/cast/docs/android_sender/customize_ui#customize_cast_button

Customize Cast Button

To add a custom mediaRouteTheme to your app's Theme:
<style name="Theme.CastVideosTheme" parent="Theme.AppCompat.Light.NoActionBar">
  
  <item name="mediaRouteTheme">@style/CustomMediaRouterTheme</item>
</style>
Declare your custom Media Router theme and declare a custom 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>
mediaRouteButtonTint should be used if the support library version is newer than 26.0.0. For older support library versions, please use buttonTint instead.

来源：https://stackoverflow.com/questions/24313565/change-chromecast-casting-icon-color

标签

android

chromecast