BottomSheetDialogFragment theme with skins - android

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>

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);
});

Popup menu style issue

I am developing one app in which I have a list and a popup menu in it. But my app has black background color and text color is white. But my popup menu back color coming is white and text color is white. I have tried all posible ways but its not working. Here is my code.
Style.xml
<attr name="iconColor" format="reference" />
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/back_color</item>
<item name="colorPrimaryDark">#android:color/holo_orange_dark</item>
<item name="android:textColor">#color/White</item>
<item name="android:textSize">12dp</item>
<item name="android:windowActionBarOverlay">true</item>
<item name="iconColor">#android:color/white</item>
<item name="android:popupBackground">#color/back_color</item>
<item name="android:popupMenuStyle">#style/PopupMenu</item>
<item name="colorAccent">#android:color/holo_red_light</item>
</style>
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" >
<item name="android:panelBackground">#color/back_color</item>
<item name="android:textColor">#color/black</item>
</style>
<style name="StyledScrollerTextAppearance" parent="#android:style/TextAppearance">
<item name="android:textSize">24sp</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">#android:color/white</item>
</style>
<style name="AppTheme.TextAppearance">
<item name="android:textColor">#color/White</item>
<item name="android:textSize">12dp</item>
</style>
<style name="AppTheme.TextAppearance.Subtitle">
<item name="android:textColor">#color/White</item>
<item name="android:textSize">10dp</item>
</style>
<style name="PopupMenu">
<item name="android:panelBackground">#color/back_color</item>
<item name="android:textColor">#color/White</item>
</style>
<style name="Theme.AppCompat.Light.NoActionBarCustom" parent="Theme.AppCompat.Light.NoActionBar" >
<item name="colorAccent">#android:color/holo_red_dark</item>
</style>
Below is recycler view adapter
#Override
public void onBindViewHolder(ItemHolder itemHolder, int i) {
Song localItem = arraylist.get(i);
itemHolder.title.setText(localItem.title);
itemHolder.artist.setText(localItem.artistName);
setOnPopupMenuListener(itemHolder, i);
}
private void setOnPopupMenuListener(ItemHolder itemHolder, final int position) {
itemHolder.popupMenu.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
Context wrapper = new ContextThemeWrapper(mContext, R.style.PopupMenu);
final PopupMenu menu = new PopupMenu(wrapper, v);
menu.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()) {
case R.id.popup_play:
break;
case R.id.popup_next:
break;
}
return false;
}
});
menu.inflate(R.menu.popup_song);
menu.show();
}
});
}
Please help me with it.
After reading comments, you need a contextual menu.
Inherit your PopupMenu from Widget.PopupMenu.
<style name="AppTheme.PopupMenu" parent="#android:style/Widget.PopupMenu">
<item name="android:popupBackground">#color/yourcolor</item>
</style>
I would suggest wrap your toolbar in AppBarLayout and in AppBarLayout theme set your menu style.
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/app_bar"
android:theme="#style/AppTheme.AppBarOverlay">
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:popupTheme="#style/AppTheme.PopupOverlay"/>
</android.support.design.widget.AppBarLayout>
Here are styles.
<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Light">
<!-- text color for toolbar and popup menu-->
<item name="android:textColorPrimary">#color/colorAccent</item>
<item name="popupMenuStyle">#style/AppTheme.PopupMenu</item>
<item name="android:popupMenuStyle">#style/AppTheme.PopupMenu</item>
</style>
<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Dark" />
<style name="AppTheme.PopupMenu" parent="#android:style/Widget.PopupMenu">
<!-- background color of popup menu-->
<item name="android:popupBackground">#color/colorBlack</item>
</style>
Finally, create your popup menu with AppBarLayout context.
AppBarLayout bar= (AppBarLayout) findViewById(R.id.app_bar);
PopupMenu p = new PopupMenu(bar.getContext(), findViewById(item.getItemId()));
For more information, read this answer.

How to change Android PopupMenu width

I am having trouble changing the width of the Appcompat PopupMenu because the menu item uses this layout abc_popup_menu_item_layout.xml in MenuPopupHelper.java, which set menu item minWidth to 196dip.
<android.support.v7.internal.view.menu.ListMenuItemView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="?attr/dropdownListPreferredItemHeight"
android:minWidth="196dip"
android:paddingRight="16dip">
I tried to override minWidth as well as dropDownWidth in the following properties in my style.xml. I also tried to override minWidth in android:dropDownItemStyle, but it did not help. I start to wonder if it is possible to override this hard coded attribute of ListMenuItemView. Has anyone succeeded in modifying a PopupMenu width?
<style name="OrderDetailsActivity" parent="AppTheme">
<item name="android:textAppearanceLargePopupMenu">#style/OrderDetailsPopupMenuTextAppearanceLarge</item>
<item name="android:textAppearanceSmallPopupMenu">#style/OrderDetailsPopupMenuTextAppearanceSmall</item>
<item name="android:dropDownListViewStyle">#style/OrderDetailsListDropDownStyle</item>
<item name="dropDownListViewStyle">#style/OrderDetailsListDropDownStyle</item>
</style>
<style name="OrderDetailsPopupMenuTextAppearanceLarge" parent="#android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Large">
<item name="android:fontFamily">sans-serif-medium</item>
<item name="android:textSize">#dimen/font_size_medium</item>
</style>
<style name="OrderDetailsPopupMenuTextAppearanceSmall" parent="#android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Small">
<item name="android:fontFamily">sans-serif-medium</item>
<item name="android:textSize">#dimen/font_size_medium</item>
</style>
<style name="OrderDetailsListDropDownStyle" parent="Widget.AppCompat.ListView.DropDown">
<item name="android:divider">#drawable/list_divider</item>
</style>
You can prepare your custom popup menu item layout file and update this static field using reflection in onCreate() method of Your Application class:
private void updatePopUpMenuItemLayout() {
try {
Field field = MenuPopupHelper.class.getDeclaredField("ITEM_LAYOUT");
field.setAccessible(true);
field.set(null, R.layout.custom_popup_menu_item_layout);
} catch (Exception e) {
Log.e("TAG", e.getMessage());
}
}

Howto customize CCL (Cast Companion Library) controller dialog

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

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