Customizing popup menu style - android

I'm currently using this style for my popup menu:
<style name="mainActivityTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
<item name="colorPrimary">#color/colorBlack</item>
<item name="colorPrimaryDark">#color/colorBlack</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
How ever it causes popup menus to have extra space on the top and bottom:
How do I make it so there is no extra space? Is there a certain style so that it wraps its contents?
Edit: I forgot to mention I inflate the view programmatically so that may be an issue
private void inflateMoreMenu(View view){
PopupMenu popupMenu = new PopupMenu(mContext, view);
popupMenu.inflate(R.menu.popup_menu);
popupMenu.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()){
case R.id.popup_menu_report:
//Inflate a layout
break;
case R.id.popup_menu_block:
//Inflate a layout
break;
}
return false;
}
});
#SuppressLint("RestrictedApi")
MenuPopupHelper menuHelper = new MenuPopupHelper(mContext, (MenuBuilder) popupMenu.getMenu(), view);
menuHelper.setForceShowIcon(true);
menuHelper.show();
}
XML for popup_menu:
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="#+id/popup_menu_report"
android:title="Report"
android:icon="#drawable/icon_messages_report"/>
<item
android:id="#+id/popup_menu_block"
android:title="Block"
android:icon="#drawable/icon_alertdialog_block"/>
</menu>

For the OverflowMenu you can define in your app theme the actionOverflowMenuStyle attribute.
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
<item name="actionOverflowMenuStyle">#style/popupOverflowMenu</item>
</style>
With:
<style name="popupOverflowMenu" parent="#style/Widget.MaterialComponents.PopupMenu.Overflow">
<item name="android:popupBackground">#drawable/my_mtrl_popupmenu_background</item>
</style>
The drawable/my_mtrl_popupmenu_background.xml file:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="?attr/colorSurface"/>
<corners
android:bottomLeftRadius="4dp"
android:bottomRightRadius="4dp"
android:topLeftRadius="4dp"
android:topRightRadius="4dp"/>
</shape>
It the original file there is the padding:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="?attr/colorSurface"/>
<corners
..../>
<padding
android:bottom="8dp"
android:top="8dp"/>
</shape>
For a popup you can use:
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
<item name="popupMenuStyle">#style/popupMenu</item>
</style>
<style name="popupMenu" parent="#style/Widget.MaterialComponents.PopupMenu">
<item name="android:popupBackground">#drawable/my_mtrl_popupmenu_background</item>
</style>

Related

Change theme to button

Hi I have 1 activity with 3 buttons,I have now created the ability to change the theme app, and up here all okay but I do not know how to go from buttoshape.xml to buttoshape_blue.xml
This is my theme:
<resources>
<style name="AppTheme.Blue" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/primaryColor_blue</item>
<item name="colorPrimaryDark">#color/primaryColorDark_blue</item>
<item name="colorAccent">#color/primaryAccent_blue</item>
<item name="backgroundColor">#color/bianco</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
<style name="AppTheme.Red" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/primaryColor_red</item>
<item name="colorPrimaryDark">#color/primaryColorDark_red</item>
<item name="colorAccent">#color/primaryAccent_red</item>
<item name="backgroundColor">#color/bianco</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
</style>
this my button in xml
<Button
android:id="#+id/magic_item"
android:text="Magic Item"
android:textColor="#FFFFFF"
android:textSize="25dp"
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#drawable/buttonshape"
android:shadowColor="#A8A8A8"
android:shadowDx="0"
android:shadowDy="0"
android:shadowRadius="5"
/>
and this is my buttonshape.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
<corners
android:radius="14dp"
/>
<gradient
android:angle="45"
android:centerX="90%"
android:centerColor="#ec2127"
android:startColor="#CC1414"
android:endColor="#FFFFFF"
android:type="linear"
/>
<padding
android:left="0dp"
android:top="0dp"
android:right="0dp"
android:bottom="0dp"
/>
<size
android:width="270dp"
android:height="60dp"
/>
<stroke
android:width="3dp"
android:color="#FFFFFF"
/>
my Utility
public class Utility {
public static void setTheme(Context context, int theme) {
SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(context);
prefs.edit().putInt(context.getString(R.string.prefs_theme_key), theme).apply();
}
public static int getTheme(Context context) {
SharedPreferences prefs = PreferenceManager.getDefaultSharedPreferences(context);
return prefs.getInt(context.getString(R.string.prefs_theme_key), -1);
}
}
and BaseActivity
public class BaseActivity extends AppCompatActivity {
private final static int THEME_BLUE = 1;
private final static int THEME_RED = 2;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
updateTheme();
}
public void updateTheme() {
if (Utility.getTheme(getApplicationContext()) <= THEME_BLUE) {
setTheme(R.style.AppTheme_Blue);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
getWindow().setStatusBarColor(getResources().getColor(R.color.primaryColorDark_blue));
}
} else if (Utility.getTheme(getApplicationContext()) == THEME_RED) {
setTheme(R.style.AppTheme_Red);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
getWindow().setStatusBarColor(getResources().getColor(R.color.primaryColorDark_red));
}
}
}
}
You could create a custom theme attribute which would contain a reference to the background to use and set it to #drawable/buttonshape for AppTheme.Red and to #drawable/buttonshape_blue for AppTheme.Blue.
E.g. in values you could have an attrs.xml file in which there would be:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<attr name="buttonBackground" format="reference" />
</resources>
and in your themes.xml:
<style name="AppTheme.Blue" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/primaryColor_blue</item>
<item name="colorPrimaryDark">#color/primaryColorDark_blue</item>
<item name="colorAccent">#color/primaryAccent_blue</item>
<item name="backgroundColor">#color/bianco</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="backgroundColor">#color/bianco</item>
<item name="buttonBackground">#drawable/buttonshape_blue</item>
</style>
<style name="AppTheme.Red" parent="Theme.AppCompat.Light.DarkActionBar">
<item name="colorPrimary">#color/primaryColor_red</item>
<item name="colorPrimaryDark">#color/primaryColorDark_red</item>
<item name="colorAccent">#color/primaryAccent_red</item>
<item name="backgroundColor">#color/bianco</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="buttonBackground">#drawable/buttonshape</item>
</style>
Your button in the layout file would look like this:
<Button
android:id="#+id/magic_item"
...
android:background="?attr/buttonBackground"
...
/>

Change Popup Menu Items font size dynamatically Android

I am creating an android app which has a popup menu and it is opened when a button is clicked and I want to increase the text size of menu items in that popup menu dynamically(based on the users input).
Can anyone help on how do that programatically?
In my class:
menuButton.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//Creating the instance of PopupMenu
PopupMenu popup = new PopupMenu(getActivity(), menuButton);
//Inflating the Popup using xml file
popup.getMenuInflater().inflate(R.menu.popup_menu, popup.getMenu());
//registering popup with OnMenuItemClickListener
popup.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()) {
case R.id.one:
// Some Stuffs
break;
case R.id.two:
// Some Stuffs
break;
default:
break;
}
return true;
}
});
And my xml file is ::
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fav_menu">
<group android:id="#+id/first_section" android:checkableBehavior="none" >
<item
android:id="#+id/one"
android:title="#string/sort"
android:visible="true"
/>
</group>
<group android:id="#+id/first_two" android:checkableBehavior="none">
<item
android:id="#+id/two"
android:title="#string/sort"
android:visible="true"
/>
</group>
</menu>
This is very easy with SpannableString:
//### format text of popup-items ###
for(int i=0;i<popup.getMenu().size();i++){
MenuItem tmpItem = popup.getMenu().getItem(i);
String tmpText = tmpItem.getTitle().toString();
SpannableString s = new SpannableString(tmpText);
s.setSpan(new RelativeSizeSpan(1.4f), 0, s.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
s.setSpan(new ForegroundColorSpan(Color.BLUE), 0, s.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
tmpItem.setTitle(s);
}
//##################################
In my style file:
<style name="menuStyle">
<item name="android:layoutDirection">rtl</item>
<item name="android:textColor">#color/onyx</item>
<item name="android:textSize">15sp</item>
<item name="android:fontFamily">#font/ge_ss_two_light</item>
</style>
In my java file:
Context myContext = new ContextThemeWrapper(context, R.style.menuStyle);
MenuBuilder menuBuilder = new MenuBuilder(context);
MenuInflater inflater = new MenuInflater(context);
inflater.inflate(R.menu.options_menu, menuBuilder);
You can change the text size by adding this code to styles.xml and use it in manifest file.
<style name="AppTheme" parent="AppBaseTheme">
<item name="android:popupMenuStyle">#style/PopupMenu</item>
<item name="android:textAppearanceLargePopupMenu">#style/myPopupMenuTextAppearanceLarge</item>
<item name="android:textAppearanceSmallPopupMenu">#style/myPopupMenuTextAppearanceSmall</item>
<!-- All customizations that are NOT specific to a particular API-level can go here. -->
</style>
<style name="PopupMenu" parent="#android:style/Widget.PopupMenu">
<item name="android:popupBackground">#android:color/white</item>
<item name="android:textSize">12sp</item>
</style>
<style name="myPopupMenuTextAppearanceSmall" parent="#android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Small">
<item name="android:textSize">15sp</item>
</style>
<style name="myPopupMenuTextAppearanceLarge" parent="#android:style/TextAppearance.DeviceDefault.Widget.PopupMenu.Large">
<item name="android:textSize">25sp</item>
</style>

Custom PopUp Menu

Hello i have to create a PopUp Menu and i know how to do that.
Here is my code to create default PopUp Menu ..
popup_menu.xml
<menu xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#+id/item"
android:showAsAction="ifRoom|withText"
android:title="item1"
android:visible="true"/>
<item
android:id="#+id/item2"
android:showAsAction="ifRoom|withText"
android:title="item2"
android:visible="true"/>
<item
android:id="#+id/item3"
android:showAsAction="ifRoom|withText"
android:title="item3"
android:visible="true"/>
PopUpMenu_Activity.java
findViewById(R.id.btn_click).setOnClickListener(new OnClickListener() {
#Override
public void onClick(View view) {
PopupMenu popupMenu = new PopupMenu(PopMenuActivity.this, view);
popupMenu.setOnMenuItemClickListener(PopMenuActivity.this);
popupMenu.inflate(R.menu.popup_menu);
popupMenu.show();
}
});
and
public boolean onMenuItemClick(MenuItem item) {
switch (item.getItemId()) {
case R.id.item1:
Toast.makeText(this, "item1 clicked", Toast.LENGTH_SHORT).show();
return true;
case R.id.item2:
Toast.makeText(this, "item2 clicked", Toast.LENGTH_SHORT).show();
return true;
case R.id.item3:
Toast.makeText(this, "item3 clicked", Toast.LENGTH_SHORT).show();
return true;
default:
return false;
}
}
My Question is how can i customize it? I want to add custom fonts in PopUp menu with semi transparent background as shown in figure.
Please help...!!!
You can use ListPopupWindow. You can submit your custom Adapter to the ListPopupWindow's object, and customize its appearance into getView
You can use android:actionViewClass property in the menu xml to define you own custom class
Customize android:spinnerDropDownItemStyle for actionBarWidgetTheme changing it's text appearance.
Also don't forget that dropdown list is managed by the adapter you use. Then if you used the standard one (simple_dropdown_item_1line) there's no problem. But if you used a custom one like me (to be able to add an icon) don't forget to apply style="?attr/spinnerDropDownItemStyle" in your layout TextView.
final custom style is:
<resources xmlns:android="http://schemas.android.com/apk/res/android">
<style name="Theme.myapp" parent="#style/Theme.Light.DarkActionBar">
<item name="android:actionDropDownStyle">#style/myapp_DropDownNav</item>
<item name="android:actionBarWidgetTheme">#style/myapp.actionBarWidgetTheme</item>
</style>
<style name="myapp.actionBarWidgetTheme" parent="#style/Theme.">
<item name="android:spinnerDropDownItemStyle">#style/myapp.Widget.DropDownItem.Spinner</item>
</style>
<style name="myapp_DropDownNav" parent="#style/Widget.Spinner.DropDown.ActionBar">
<item name="background">#drawable/spinner_background_ab_myapp</item>
<item name="android:background">#drawable/spinner_background_ab_myapp</item>
<item name="android:popupBackground">#drawable/menu_dropdown_panel_myapp</item>
<item name="android:dropDownSelector">#drawable/selectable_background_myapp</item>
</style>
<style name="myapp.Widget.DropDownItem.Spinner" parent="Widget.DropDownItem.Spinner">
<item name="android:textAppearance">#style/myapp.TextAppearance.Widget.DropDownItem</item>
</style>
<style name="myapp.TextAppearance.Widget.DropDownItem" parent="TextAppearance.Widget.DropDownItem">
<item name="android:textColor">#color/black</item>
</style>

android: PopUp Menu does not apply style

i have an Activity with an Action Bar. The Action Bar PopUp Menu (that appears after clicking the overflow button) applies my defined style.
But there is a EditText View inside my Activity, that should open a popup Menu by clicking on it.
This PopUp does not apply the style.
I hope someone can help me out..
Thx!!
Theme:
<style name="MyTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- ActionBar -->
<item name="android:actionBarStyle">#style/ActionBar</item>
<item name="android:actionBarTabStyle">#style/ActionBarTabStyle</item>
<item name="android:popupMenuStyle">#style/ActionBarPopupMenu</item>
<item name="android:dropDownListViewStyle">#style/ActionBarDropDownListView</item>
<item name="android:actionBarWidgetTheme">#style/ActionBar.Theme.actionbar.widget</item>
<item name="actionMenuTextColor">#color/mytheme_white_color</item>
<item name="android:actionMenuTextColor">#color/mytheme_white_color</item>
<item name="android:actionDropDownStyle">#style/ActionBarDropDownNav</item>
<item name="android:spinnerDropDownItemStyle">#style/ActionBarDropDownItem</item>
<item name="android:titleTextStyle">#style/ActionBarTextStyle</item>
<item
name="actionBarItemBackground">#drawable/ns_actionbar_selectable_background_selector</item>
<item name="android:actionBarItemBackground">#drawable/ns_actionbar_selectable_background_selector</item>
<!-- Custom Items: -->
<item name="android:editTextStyle">#style/EditTextStyle_singleLine</item>
<item name="android:buttonStyle">#style/ButtonStyle_Default</item>
<item name="android:checkboxStyle">#style/ns_CheckBoxStyle</item>
</style>
Styles:
<style name="ActionBarPopupMenu" parent="#android:style/Widget.Holo.Light.ListPopupWindow">
<item name="android:popupBackground">#drawable/menu_dropdown_panel_actionbar</item>
<item name="android:divider">#drawable/ns_linearlayout_list_divider</item>
</style>
<style name="ActionBarDropDownListView" parent="#android:style/Widget.Holo.Light.ListView.DropDown">
<item name="android:listSelector">#drawable/selectable_background_actionbar</item>
<item name="android:divider">#drawable/ns_linearlayout_list_divider</item>
</style>
<style name="ActionBar.Theme.actionbar.widget" parent="#android:style/Theme.Holo">
<item name="android:popupMenuStyle">#style/ActionBarPopupMenu</item>
<item name="android:dropDownListViewStyle">#style/ActionBarDropDownListView</item>
<item name="android:textColor">#color/mytheme_darkblue_color</item>
<item name="android:textAllCaps">true</item>
<item name="android:textSize">#dimen/text_spinner_item</item>
</style>
Code for non workin PopUp::
public class LoginActivity extends Activity {
......
userName = (EditText) this.findViewById(R.id.txtUname);
userName.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
showPopupMenu(userName);
}
});
private void showPopupMenu(View v) {
PopupMenu popupMenu = new PopupMenu(LoginActivity.this, v);
popupMenu.getMenuInflater().inflate(R.menu.test, popupMenu.getMenu());
popupMenu
.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
#Override
public boolean onMenuItemClick(MenuItem item) {
Toast.makeText(LoginActivity.this, item.toString(),
Toast.LENGTH_LONG).show();
return true;
}
});
popupMenu.show();
}
Results:

Remove/add shadow effect dynamically

When my button disabled i need remove text shadow effect and when button enable I need add this effect again.
selector_btn.xml
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:drawable="#drawable/btn_disabled"
android:state_enabled="false" />
<item
android:drawable="#drawable/btn_pressed"
android:state_pressed="true" />
<item
android:drawable="#drawable/btn_default" />
styles.xml
<style name="TextShadow">
<item name="android:textColor">#ffffffff</item>
<item name="android:shadowColor">#0D67B9</item>
<item name="android:shadowRadius">2.0</item>
<item name="android:shadowDy">-2.0</item>
</style>
<style name="BigButton" parent="TextShadow">
<item name="android:background">#drawable/selector_btn</item>
</style>
You have make 2 defferent styles for enable and disable condition and apply it to textview when it disable or vise versa ...
<style name="TextShadow_disable">
<item name="android:textColor">#ffffffff</item>
<item name="android:shadowColor">#0D67B9</item>
<item name="android:shadowRadius">0</item>
<item name="android:shadowDy">0</item>
</style>
<style name="TextShadow_enable">
<item name="android:textColor">#ffffffff</item>
<item name="android:shadowColor">#0D67B9</item>
<item name="android:shadowRadius">2.0</item>
<item name="android:shadowDy">-2.0</item>
</style>
textstyle = (TextView) findViewById(R.id.mytext);
textstyle.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
getTextStyle();
}
});
write down this method to check enable disable;
public void getTextStyle() {
if(textstyle.isEnabled()){
textstyle.setTextAppearance(this, R.style.TextShadow_enable);
}
else{
textstyle.setTextAppearance(this, R.style.TextShadow_disable);
}
}

Categories

Resources