Howto customize CCL (Cast Companion Library) controller dialog - android

I'm trying to customize casting controller dialog and I have problems changing dialog's title style. I've implemented it like CCL library does but without success.
This is my relevant code:
VideoMediaRouteControllerDialog.java
public VideoMediaRouteControllerDialog(Context context) {
super(context, xxx.xxx.R.style.TTNCastDialog);
...
}
VideoMediaRouteControllerDialogFragment.java
public class VideoMediaRouteControllerDialogFragment extends MediaRouteControllerDialogFragment {
#Override
public VideoMediaRouteControllerDialog onCreateControllerDialog(Context context, Bundle savedInstanceState) {
VideoMediaRouteControllerDialog customControllerDialog = new VideoMediaRouteControllerDialog(context);
customControllerDialog.setVolumeControlEnabled(false);
return customControllerDialog;
}
}
VideoMediaRouteDialogFactory.java
public class VideoMediaRouteDialogFactory extends MediaRouteDialogFactory {
#Override
public VideoMediaRouteControllerDialogFragment onCreateControllerDialogFragment() {
return new VideoMediaRouteControllerDialogFragment();
}
}
styles.xml
<style name="TTNCastDialog" parent="#android:style/Theme.Dialog">
<item name="android:windowTitleStyle">#style/TTNCastDialogWindowTitle</item>
</style>
<style name="TTNCastDialogWindowTitle">
<item name="android:textSize">22sp</item>
<item name="android:textColor">#color/ccl_mr_custom_title</item>
</style>
styles.xml(v21)
<style name="TTNCastDialog" parent="android:Theme.Material.Dialog">
<item name="android:windowTitleStyle">#style/TTNCastDialogWindowTitle</item>
</style>
I've taken a look at MediaRouteThemeHelper's getButtonTextColor method
and it returns accent color instead of primary color. My application theme extends of Theme.AppCompat.Light.NoActionBar
I've tried this way too
styles.xml
<style name="TTNCastDialog" parent="Theme.AppCompat.Light.Dialog.Alert">
<item name="android:windowTitleStyle">#style/TTNCastDialogWindowTitle</item>
</style>
<style name="TTNCastDialogWindowTitle">
<item name="android:textSize">22sp</item>
<item name="android:textColor">#color/ccl_mr_custom_title</item>
</style>
But it did not work.
Any suggestions?
Thanks

Related

How to change app theme dynamically programmatically

How to change the App theme dynamically in android. I have an app with many users, when users log in, as per requirements I have to change the app theme dynamically.
Try this
styles.xml
<style name="lightTheme">
<item name="android:textViewStyle">#style/LightStyledTextView</item>
<item name="android:windowAnimationStyle">#null</item>
<item name="actionOverflowMenuStyle">#style/LightStyledOptionsMenu</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="darkTheme">
<item name="android:textViewStyle">#style/DarkStyledTextView</item>
<item name="android:windowAnimationStyle">#null</item>
<item name="actionOverflowMenuStyle">#style/DarkStyledOptionsMenu</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="LightStyledTextView" parent="Widget.AppCompat.TextView.SpinnerItem">
<item name="android:textColor">#color/black</item>
</style>
<style name="DarkStyledTextView" parent="Widget.AppCompat.TextView.SpinnerItem">
<item name="android:textColor">#color/white</item>
</style>
<!-- Menu Styles-->
<style name="LightStyledOptionsMenu" parent="ThemeOverlay.AppCompat.Light">
<item name="overlapAnchor">false</item>
<item name="android:popupBackground">#color/white</item>
<item name="android:textColor">#color/blue_grey</item>
</style>
<style name="DarkStyledOptionsMenu" parent="ThemeOverlay.AppCompat.Dark">
<item name="overlapAnchor">false</item>
<item name="android:popupBackground">#color/blue_grey</item>
<item name="android:textColor">#color/white</item>
</style>
create this in BaseActivity and call in onCreate method
public void updateTheme()
{
if (Utility.getTheme(getApplicationContext()))
{
setTheme(R.style.darkTheme);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
}
else
{
setTheme(R.style.lightTheme);
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
}
}
Utility.java
public static void setTheme(Context context, boolean theme)
{
SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(context);
prefs.edit().putBoolean(context.getString(R.string.prefs_theme_key), theme).apply();
}
public static Boolean getTheme(Context context)
{
SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(context);
return prefs.getBoolean(context.getString(R.string.prefs_theme_key), false);
}
and in any Activity use any component to change theme, in this case Switch
Switch darkModeSwitch = findViewById(R.id.darkModeSwitch);
darkModeSwitch.setChecked(Utility.getTheme(this));
darkModeSwitch.setOnCheckedChangeListener((compoundButton, checked) ->
{
Utility.setTheme(getApplicationContext(), checked);
});

BottomSheetDialogFragment theme with skins

How to combine BottomSheetDialogFragment theme with other themes?
My app has skins which are made using themes. BottomSheetDialogFragment should have rounded corners, and I achieve this using:
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setStyle(BottomSheetDialogFragment.STYLE_NORMAL, R.style.CustomBottomSheetDialogTheme) /* hack to make background transparent */
}
Then in styles.xml:
<style name="CustomBottomSheetStyle" parent="Widget.Design.BottomSheet.Modal">
<item name="android:background">#android:color/transparent</item>
</style>
<style name="CustomBottomSheetDialogTheme" parent="Theme.MaterialComponents.Light.BottomSheetDialog">
<item name="bottomSheetStyle">#style/CustomBottomSheetStyle</item>
</style>
But If I extend from the Theme.MaterialComponents.Light.BottomSheetDialog I do not get the color scheme which I have defined in the skin theme.
So the question is: How to define Dialog theme inside the skin theme?
You can add in your app theme the bottomSheetDialogTheme attribute to set globally in your app the bottomsheetDialog style.
<style name="AppTheme" parent="Theme.MaterialComponents.*">
......
<item name="bottomSheetDialogTheme">#style/BottomSheetDialog_Rounded</item>
</style>
<style name="BottomSheetDialog_Rounded" parent="#style/ThemeOverlay.MaterialComponents.BottomSheetDialog">
<item name="bottomSheetStyle">#style/BottomSheet_Rounded</item>
</style>
Otherwise in your BottomSheetDialogFragment you can override the getTheme() method.
public class RoundedBottomSheetDialog extends BottomSheetDialogFragment {
//....
#Override public int getTheme() {
return R.style.BottomSheetDialog_Rounded;
}
}
Also to get rounded corners you can use something like:
<!-- BottomSheet Dialog-->
<style name="BottomSheetDialog_Rounded" parent="#style/ThemeOverlay.MaterialComponents.BottomSheetDialog">
<item name="bottomSheetStyle">#style/BottomSheet_Rounded</item>
</style>
<style name="BottomSheet_Rounded" parent="Widget.MaterialComponents.BottomSheet">
<item name="shapeAppearanceOverlay">#style/ShapeAppearanceBottomSheetDialog_Rounded</item>
</style>
<style name="ShapeAppearanceBottomSheetDialog_Rounded" parent="">
<item name="cornerFamily">rounded</item>
<item name="cornerSizeTopRight">16dp</item>
<item name="cornerSizeTopLeft">16dp</item>
<item name="cornerSizeBottomRight">0dp</item>
<item name="cornerSizeBottomLeft">0dp</item>
</style>
Try this instead
kotlin
override fun getTheme(): Int = R.style.CustomBottomSheetDialogTheme
java
#Override
public int getTheme() {
return R.style.CustomBottomSheetDialogTheme
}
override fun onCreateDialog(#Nullable savedInstanceState: Bundle?): Dialog
val dialog = BottomSheetDialog(context!!,R.style.FullScreenBottomSheet)
<style name="FullScreenBottomSheet"
parent="Theme.MaterialComponents.Light.BottomSheetDialog">
<item name="android:windowFullscreen">false</item>
<item name="android:colorBackgroundCacheHint">#null</item>
<item name="android:windowBackground">#color/transparent</item>
<item name="android:statusBarColor">#color/transparent</item>
</style>

Style dialog after click on MediaRouteButton

Hi can someone help me with styling dialog that appears after clicking on MediaRouteButton?
There is a white text displayed on gray background which doesn't look good.
android.support.v7.app.MediaRouteButton
is wrapped in parent with styles
<FrameLayout
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:fitsSystemWindows="true"
app:popupTheme="#style/ThemeOverlay.AppCompat.Dark"
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar">
(I know that I should use Toolbar here but it doesn't match my requirements)
which works good on MediaRouteButton which turns white, but it have no influence on dialog styles.
I tried to look at sample app provided by Google, but I haven't found anything that helps me. Link to sample app styles
My current theme:
<style name="Theme.AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>//Blue
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>//dark blue
<item name="colorAccent">#color/colorPrimary</item>//blue
</style>
Found a solution that worked for me.
At first you have to set a custom MediaRouteDialogFactory on your MediaRouteButton
mMediaRouteMenuItem = CastButtonFactory.setUpMediaRouteButton(this, menu, R.id.media_route_menu_item);
MediaRouteButton mediaRouteButton = (MediaRouteButton) mMediaRouteMenuItem.getActionView()
mediaRouteButton.setDialogFactory(new ThemeableMediaRouteDialogFactory());
Cause the default MediaRouteDialogFactory will always create non themed Dialogs
#NonNull
public MediaRouteControllerDialogFragment onCreateControllerDialogFragment() {
return new MediaRouteControllerDialogFragment();
}
which will lead to
public MediaRouteControllerDialog onCreateControllerDialog(
Context context, Bundle savedInstanceState) {
return new MediaRouteControllerDialog(context);
}
but there is also a themed constructor MediaRouteControllerDialog(Context context, int theme)
which is not called from original MediaRouteDialogFactory.
So your ThemeableMediaRouteDialogFactory should be look like this
public class ThemeableMediaRouteDialogFactory extends MediaRouteDialogFactory {
#NonNull
#Override
public MediaRouteChooserDialogFragment onCreateChooserDialogFragment() {
return new ThemeableMediaRouterChooserDialogFragment();
}
#NonNull
#Override
public MediaRouteControllerDialogFragment onCreateControllerDialogFragment() {
return new ThemeableMediaRouteControllerDialogFragment();
}
}
with
public class ThemeableMediaRouterChooserDialogFragment extends MediaRouteChooserDialogFragment {
#Override
public MediaRouteChooserDialog onCreateChooserDialog(Context context, Bundle savedInstanceState) {
return new MediaRouteChooserDialog(context, R.style.CastChooserDialogTheme);
}
}
and
public class ThemeableMediaRouteControllerDialogFragment extends MediaRouteControllerDialogFragment {
#Override
public MediaRouteControllerDialog onCreateControllerDialog(Context context, Bundle savedInstanceState) {
return new MediaRouteControllerDialog(context, R.style.CastControllerDialogTheme);
}
}
Your themes/styles can also be customized
<style name="DarkDialogTheme" parent="Theme.AppCompat.Dialog">
<item name="colorPrimary">#color/charcoal_grey</item>
<item name="colorPrimaryDark">#color/charcoal_grey_dark</item>
<item name="colorAccent">#color/pumpkin_orange</item>
<item name="android:windowBackground">#color/dark_grey</item>
<item name="android:textColorPrimary">#android:color/white</item>
<item name="android:windowNoTitle">true</item>
</style>
<style name="CastChooserDialogTheme" parent="DarkDialogTheme">
<item name="android:windowNoTitle">false</item>
<item name="mediaRouteChooserPrimaryTextStyle">#style/MediaRouteChooserPrimaryText</item>
<item name="mediaRouteChooserSecondaryTextStyle">#style/MediaRouteChooserSecondaryText</item>
</style>
<style name="CastControllerDialogTheme" parent="DarkDialogTheme">
<item name="MediaRouteControllerWindowBackground">#color/dark_grey</item>
<item name="colorPrimary">#color/dark_grey</item>
<item name="mediaRouteCloseDrawable">#drawable/ic_dialog_close_dark</item>
<item name="mediaRouteControllerTitleTextStyle">#style/Widget.MediaRouter.ControllerText.Title.Dark</item>
</style>

Popup menu divider for App compat theme

I used app compat theme style .
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="android:popupMenuStyle">#style/PopupMenu</item>
<item name="android:itemTextAppearance">#style/myCustomMenuTextApearance</item>
<item name="android:listPopupWindowStyle">#style/PopupMenuStyle</item>
</style>
<style name="PopupMenuStyle" parent="Widget.AppCompat.ListPopupWindow">
<item name="android:divider">#drawable/devider</item>
<item name="android:dividerHeight">2dp</item>
</style>
<style name="PopupMenu" parent="#android:style/Widget.PopupMenu">
<item name="android:popupBackground">#color/search_panel_color</item>
<item name="android:textColor">#color/activity_button_text_color</item>
<item name="android:shadowColor">#color/activity_theam_color</item>
</style>
<style name="myCustomMenuTextApearance" parent="#android:style/TextAppearance.Widget.TextView.PopupMenu">
<item name="android:textColor">#color/activity_theam_color</item>
</style>
I want to add a divider in my menu item.
I've tried so many things, but the divider is not applying...
Is there any way to show the divider?
I also have the same problem. The solution is like this:
<style name="PopupMenuListView" parent="#style/Widget.AppCompat.ListView.DropDown">
<item name="android:divider">#000000</item>
<item name="android:dividerHeight">1dp</item>
</style>
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="android:dropDownListViewStyle">#style/PopupMenuListView</item>
</style>
You can also refer to the following link:
How to add dividers between specific menu items?
I have one solution.you can design popup as per your choice by programming.use below code to display popup menu.
private ListPopupWindow listPopupWindow;
listPopupWindow = new ListPopupWindow(getApplicationContext());
listPopupWindow.setWidth(400);
listPopupWindow.setDropDownGravity(Gravity.CENTER);
listPopupWindow.setAdapter(new listpopupadapter(a, type));
listPopupWindow.setAnchorView(v);
listPopupWindow.show();
Here listpopupadapter is class to design your list as it below.
public class listpopupadapter extends BaseAdapter {
ArrayList<String> a;
String type;
public listpopupadapter(ArrayList<String> a, String type) {
this.a = a;
this.type = type;
}
#Override
public int getCount() {
return a.size();
}
#Override
public Object getItem(int position) {
return getItem(position);
}
#Override
public long getItemId(int position) {
return position;
}
#SuppressLint("ViewHolder")
#Override
public View getView(final int position, View convertView,
ViewGroup parent) {
// TODO Auto-generated method stub
View root = LayoutInflater.from(parent.getContext()).inflate(
R.layout.raw_filter, null);
}
}
From your theme style, I guessed you used Toolbar. Is your menu popup is showed from Toolbar? If so, you can customize as the following step.
Define the theme
<style name="AppToolbarPopupTheme" parent="Widget.AppCompat.PopupMenu.Overflow">
<item name="android:dropDownListViewStyle">#style/AppDropDownListViewStyle</item>
</style>
<style name="AppDropDownListViewStyle" parent="Widget.AppCompat.ListView.DropDown">
<item name="android:divider">#drawable/line_divider</item>
<item name="android:dividerHeight">1dp</item>
</style>
Then apply the theme to Toolbar
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:popupTheme="#style/AppToolbarPopupTheme">
</android.support.v7.widget.Toolbar>
if you haven't found the answer to this question then this is how it worked for me using the style:
<style name="PopupMenu">
<item name="android:itemBackground">#color/background_medium_gray</item>
<item name="android:background">#android:color/transparent</item>
<item name="android:textColor">#android:color/black</item>
<item name="android:colorBackground">#color/BackgroundGray</item>
<item name="android:dividerHeight">1dp</item>
</style>
Context context = new ContextThemeWrapper(getActivity(), R.style.PopupMenu);
final PopupMenu popupMenu = new PopupMenu(context, view);
final MenuInflater menuInflater = popupMenu.getMenuInflater();
I suggest you add dummy groups,try this way
<group>
<!--add it like as a separator-->
<item
android:title=""
android:showAsAction="always"
android:enabled="false" />
</group>
Using a Material theme removes dividers.May be this is the simple solution to this problem.
You can try this or any holo theme (i.e #android:style/Widget.ListPopupWindow) to get divider effect in popup
<!-- Change Overflow Menu ListView Divider Property -->
<style name="PopupMenuListView" parent="android:Widget.ListPopupWindow">
<item name="android:divider">#FF0000</item>
<item name="android:dividerHeight">2dp</item>
</style>
I've made a driver app that needed a popup the ride was coming, at that time I used this one. So please try this one. Maybe it will help.
<activity
android:name="driver_activity_name
android:theme="#android:style/Theme.Translucent.NoTitleBar" />

Why is the text selection tool is half shown and is not clickable

I have an AppCompatActivity which contains android.app.Fragment. In fragment I have a button on the toolbar which fires the method showDialog():
#Override
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId() == R.id.action_add_ingredient) {
showDialog();
return true;
}
return super.onOptionsItemSelected(item);
}
private void showDialog() {
// 1. Instantiate an AlertDialog.Builder with its constructor
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
// 2. Chain together various setter methods to set the dialog
// characteristics
builder.setTitle(R.string.dialog_ingredient_add_title);
builder.setView(mActivityMain.getLayoutInflater().inflate(
R.layout.dialog_shopping_ingredient_add, null));
builder.setPositiveButton(R.string.dialog_ingredient_ok,
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
dialog.dismiss();
}
});
builder.setNegativeButton(R.string.dialog_ingredient_cancel,
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog, int id) {
dialog.dismiss();
}
});
// 3. Get the AlertDialog from create()
dialog = builder.create();
dialog.show();
}
As it can be seen from the code, a android.support.v7.app.AlertDialog appears.
Picture 1. AlertDialog shown.
Then I select some text.
Picture 2. Text selected.
And somehow text selection tool shows only half of it and is unclickable.
My styles.xml file is below.
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="AppTheme.Base" />
<style name="AppTheme.Base" parent="Theme.AppCompat.Light.NoActionBar">
<!-- colorPrimary is used, for instance, for the default ActionBar (but not Toolbar) background. We specify the same color for the toolbar background in toolbar.xml.. -->
<item name="colorPrimary">#color/color_primary</item>
<!-- colorPrimaryDark is used for the status bar (with the battery, clock, etc). -->
<item name="colorPrimaryDark">#color/color_primary_dark</item>
<!-- colorAccent is used as the default value for colorControlActivated which is used to tint widgets. -->
<item name="colorAccent">#color/color_accent</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="drawerArrowStyle">#style/DrawerArrowStyle</item>
<item name="android:itemTextAppearance">#style/MenuTextApearance</item>
<item name="colorControlNormal">#000000</item>
<item name="colorControlActivated">#color/color_highlight_text</item>
<item name="colorControlHighlight">#color/color_highlight_text</item>
<item name="actionMenuTextColor">#android:color/white</item>
<item name="android:actionMenuTextColor">#android:color/white</item>
<item name="windowActionModeOverlay">true</item>
<item name="android:textColorHighlight">#color/color_highlight_text</item>
<item name="actionModeBackground">#drawable/myapp_action_mode_background</item>
</style>
<style name="DrawerArrowStyle" parent="Widget.AppCompat.DrawerArrowToggle">
<item name="spinBars">true</item>
<item name="color">#android:color/white</item>
</style>
<style name="MenuTextApearance" parent="#android:style/TextAppearance.Widget.IconMenu.Item">
<item name="android:textColor">#000000</item>
</style>
<style name="ActionBarThemeOverlay" parent="">
<item name="android:textColorPrimary">#FFFFFF</item>
<item name="colorControlNormal">#FFFFFF</item>
<item name="colorControlHighlight">#00000000</item>
</style>
<style name="HeaderBar">
<item name="android:background">?colorPrimary</item>
</style>
<style name="HeaderBarTransparent">
<item name="android:background">#color/color_primary_transparent</item>
</style>
<style name="ActionBarPopupThemeOverlay" parent="ThemeOverlay.AppCompat.Light">
<item name="android:background">#00000000</item>
<item name="android:textColor">#FFFFFF</item>
</style>
Question:
How can I make the text selection tool fully visible and clickable?

Categories

Resources