Android: change background color showing dialog - java

How do we change the background's foreground color when we show a DialogFragment, like when we click on the fab in the evernote or messenger app, I know the way to do it will probably be diffrent but that's the kind of effect I'm looking for

I have found a work around for this problem. Here is the code.
In styles.xml design a custom theme.
styles.xml
<style name="AppTheme.CustomTheme">
<item name="android:windowIsFloating">true</item>
<item name="windowActionBar">false</item>
<item name="windowNoTitle">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
</style>
In manifest file use this style on the popup window.
Android Manifest
<activity android:name=".DialogDesign"
android:theme="#style/AppTheme.CustomTheme"
android:screenOrientation="portrait"></activity>
In layout.xml file use 3 different relativeLayouts, one as root, another as faded background and another as pop-up window.
activity_dialog_design.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".DialogDesign">
<RelativeLayout
android:id="#+id/fadedBg"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#7fffffff"
android:layout_margin="0dp"/>
<RelativeLayout
android:layout_width="300dp"
android:layout_height="500dp"
android:layout_alignParentBottom="true"
android:layout_marginTop="100dp"
android:layout_marginBottom="100dp"
android:layout_centerHorizontal="true"
android:background="#android:color/white"/>
</RelativeLayout>
In activity.java file set the height and width of the faded window.
DialogDesign.java
public class DialogDesign extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_dialog_design);
RelativeLayout fadedBg=(RelativeLayout)findViewById(R.id.fadedBg);
WindowManager.LayoutParams params = getWindow().getAttributes();
params.height = 1800;
params.width = 1100;
this.getWindow().setAttributes(params);
}
}
There, It is done! Add whatever you want to add in the inner most relative layout.

Easy answer
The amount by which the content behind a floating window (such as dialog) goes darker is determined by backgroundDimAmount attribute in your theme:
<style name="AppTheme" parent="#style/Theme.AppCompat">
<item name="android:backgroundDimAmount">0.6</item>
</style>
It is limited to black color. 0.6 is the default value.
EDIT
The above answer did not work, looks like the value needs to be applied to the dialog theme, not the activity theme.
<style name="AppTheme" parent="#style/Theme.AppCompat">
<item name="alertDialogTheme">#style/AppTheme.Dialog.Alert</item>
</style>
<style name="AppTheme.Dialog.Alert" parent="#style/Theme.AppCompat.Dialog.Alert">
<item name="android:backgroundDimAmount">0.6</item>
</style>
Difficult answer
Achieving a different color would require disabling this system dim and heavily customizing dialog background. I'll leave this to someone else.

It might be some late to answer. but i combined some solutions and gained the proper way to achieve this goal.
first create the following theme in your styles.xml:
<style name="MyCustomTheme" parent="#android:style/Theme.Panel">
<item name="android:backgroundDimEnabled">true</item>
<item name="android:backgroundDimAmount">0.7</item>
</style>
first enable an attribute named 'backgroundDimEnabled' to make the screen foreground darker when dialogs showing on the screen. then set a float value for amount of darkness.(0 < value < 1)
and use this theme in the onCreateDialog Method in your dialog fragment.
#Override
public Dialog onCreateDialog(#Nullable Bundle savedInstanceState) {
final AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), R.style.MyCustomTheme);
View addDialogView = getActivity().getLayoutInflater().inflate(R.layout.word_detail_fragment, null);
builder.setView(addDialogView);
return builder.create();
}

Related

Dim or blur background of popup window

I am able to get the pop up window but the background is transparent also I am able to read the contents of the activity behind it. I want to dim the background so the pop up and the older activity gets differentiated.
You can do it in 2 ways
1. by adding background color with transparency, to the parent of your popup layout.
example:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#cc000000">
<YOUR_POPUP_VIEW
.... />
</RelativeLayout>
WindowManager.LayoutParams layoutParams = getWindow().getAttributes();
layoutParams.dimAmount = #WHAT_EVER_VALUE_YOU_WANT_TO_KEEP; //Generally in between 0.70f to 0.80f
getWindow().addFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);
getWindow().setAttributes(layoutParams);
From API 31+, there are two window attributes we can use to achieve that.
<item name="android:windowBlurBehindEnabled">true</item>
<item name="android:windowBlurBehindRadius">Xdp</item>
If your foal is to run an Activity Dialog-alike, then we have more flags we might want to explore:
<!-- Removes Window Title. windowActionBar=false is not needed. -->
<item name="windowNoTitle">true</item>
<!-- When enabling Blur, we also need to provide the blur radius. -->
<!-- Only available on Min Sdk 21. -->
<item name="android:windowBlurBehindEnabled">true</item>
<item name="android:windowBlurBehindRadius">12dp</item>
<!-- In case we want our Activity to behave like a Dialog. -->
<item name="android:windowCloseOnTouchOutside">true</item>
<item name="android:windowIsFloating">true</item>
<!-- We can mix blur + dim or we can just go with blur. This is to remove the dimmed bg. -->
<item name="android:backgroundDimEnabled">false</item>
I haven't figured out what's the best option for retro-compatibility purposes, but as soon as I find it I'll update the post.

Why boxes are invisible in checkbox?

after created this style:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="colorPrimary">#color/offer_text_background</item>
<item name="colorPrimaryDark">#color/app_background</item>
<item name="android:checkboxStyle">#style/settingsNotificationCategory</item>
</style>
<style name="settingsNotificationCategory">
<item name="android:textSize">30sp</item>
</style>
My box from checkbox is removing:
invisible boxes
Without this style:
visible boxes
I need create chceckbox dynamically in kotlin:
var checkBox = CheckBox(this)
checkBox.text = category
checkBox.setTextColor(resources.getColor(R.color.customText))
checkBox.isChecked = true
notificationCategoryLayout.addView(checkBox)
what's happened?
I tried :
var checkBox = CheckBox(this, null, R.style.settingsNotificationCategory)
checkBox.text = category
checkBox.setTextColor(resources.getColor(R.color.customText))
checkBox.isChecked = true
notificationCategoryLayout.addView(checkBox)
but the effect is the same...
Thanks for help
You are given the checkbox a style that contains only the textSize so it will affect on the style of the checkbox you can do 2 things:
first just set the textsize programatically:
checkBox.setTextSize(TypedValue.COMPLEX_UNIT_SP, 30);
or adjust your style to be like this:
<style name="settingsNotificationCategory" parent="Widget.AppCompat.CompoundButton.CheckBox">
<item name="android:textSize">30sp</item>
</style>
to inherit the base style of the checkbox
but when I create checbox in layout:
<CheckBox
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="test"
android:textColor="#color/customText"
android:theme="#style/settingsNotificationCategory"/>
this is working without
parent="Widget.AppCompat.CompoundButton.CheckBox"
is possible to set theme in code?
I want set textSize via style because I use layouts to different resolution (for large, xlarge, small sizes)

Style AlertDialog Submit Button and Title

I am styling my AlertDialog. I have successfully been able to style the background (see its blue) and the single choice items (see they are white with orange text).
Is it possible to style the AlertDialog title background, the footer submit button and footer background? See the image below for these areas highlighted in red. Is it possible to make the AlertDialog to have rounded rectangle corners?
As you can see I can set the title label background colour to blue but not the whole title background?
Implementation:
AlertDialog.Builder builder = new AlertDialog.Builder(new ContextThemeWrapper(mActivity, R.style.AlertDialogCustom));
builder.setTitle("Select");
ArrayAdapter<CharSequence> adapter = new ArrayAdapter<CharSequence>(
getActivity(), R.layout.choices, choices);
builder.setSingleChoiceItems(adapter, -1, myOnClickListener);
// Styles.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AlertDialogCustom" parent="#android:style/Theme.Dialog">
<item name="android:textColor">#00FF00</item>
<item name="android:textSize">10sp</item>
<item name="android:background">#0000ff</item>
<item name="android:fontFamily">fonts/myCustomFont.ttf</item>
</style>
</resources>
// choices.xml
<?xml version="1.0" encoding="utf-8"?>
<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/text1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="?android:attr/listPreferredItemHeight"
android:textAppearance="?android:attr/textAppearanceListItemSmall"
android:fontFamily="fonts/myCustomFont.ttf"
android:textColor="#color/theme_orange"
android:gravity="center_vertical"
android:ellipsize="marquee"
android:text="Text"
android:background="#fff"
android:paddingLeft="16dip"
android:paddingRight="7dip"/>
You can use a custom layout (xml file) instead of this and add all your requirements there.
Then set that view to your dialog as:
builder.setView(R.layout.custom_view);
Also don't forget to remove the title as mentioned here.
In this link I showed how to Style AlertDialog Submit Button and Title. It also shows how to customize the AletDialog. For example, how to change divider colro and etc. Please visit this link:
https://stackoverflow.com/a/33439849/5475941.
I hope it helps.

I want to hide my title bar in my android application [duplicate]

I am trying to use a custom title to include an image button to the title bar.
I got a lot of help form this post: android: adding button to the title of the app?, but could not get it work for my ListActivity.
In a nutshell, following is what I have:
I hide the titlebar in the AndroidManifest.xml
The specify a relative layout for the custom title (workorder_list_titlebar.xml)
My Activity Class looks like the following:
public class WorkOrderListActivity extends ListActivity {
String[] orders={"WO-12022009", "WO-12302009","WO-02122010", "02152010"};
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_CUSTOM_TITLE);
this.getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.workorder_list_titlebar);
setContentView(R.layout.workorder_list);
setListAdapter(new ArrayAdapter(this,R.layout.workorder_list, R.id.label,orders));
}
}
When I ran the app, I got AndroidRuntimeException: You cannot combine custom titles with other title features.
Base on the stack trace, the exception was thrown by com.android.internal.policy.impl.PhoneWindow.requestFeature(PhoneWindow.java:183), that was triggered by setlistAdapter call.
Does anyone have the same problem with ListActivity?
Also once I manage to get this work, how do I attach listeners to the image button for it to do something?
Thanks in advance.
I had the same issue and I fix it deleting
<item name="android:windowNoTitle">true</item>
from my theme.xml
Make you create custom style in “values” folder. Make sure you code as below.
<style name="CustomTheme" parent="android:Theme">
Don't modify parent parameter.
This did work for me.
Instead of modifying your theme.xml you may also:
create a new XML style file my_theme.xml in values folder like this:
<style name="MyWindowTitleBackground">
<item name="android:background">#444444</item>
</style>
<style name="MyTheme" parent="android:Theme">
<item name="android:windowTitleBackgroundStyle">#style/MyWindowTitleBackground</item>
</style>
You may define other settings as you like in this theme.
Then just use this theme in your manifest within the activity's attributes
android:theme="#style/MyTheme"
Finally set your custom title as always in your activity.java:
final Window window = getWindow();
boolean useTitleFeature = false;
// If the window has a container, then we are not free
// to request window features.
if (window.getContainer() == null) {
useTitleFeature = window
.requestFeature(Window.FEATURE_CUSTOM_TITLE);
}
setContentView(R.layout.screen_main);
if (useTitleFeature) {
window.setFeatureInt(Window.FEATURE_CUSTOM_TITLE,
R.layout.custom_title);
// Set up the custom title
main_title = (TextView) findViewById(R.id.title_left_text);
main_title.setText(R.string.app_name);
main_title = (TextView) findViewById(R.id.title_right_text);
main_title.setText(R.string.Main_titleInfo);
}
Don't forget to define the custom_title.xml file in your layout folder. For example...
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center_vertical" >
<TextView
android:id="#+id/title_left_text"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_alignParentLeft="true"
android:ellipsize="end"
android:singleLine="true" />
<TextView
android:id="#+id/title_right_text"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_centerInParent="true"
android:ellipsize="end"
android:singleLine="true"
android:textColor="#fff" />
</RelativeLayout>
I think notenking is right, that this is a problem in activities within tabs. Since some of my activities can either be stand-alone or within a tab, I've found the following helps:
final Window window = getWindow();
boolean useTitleFeature = false;
// If the window has a container, then we are not free
// to request window features.
if(window.getContainer() == null) {
useTitleFeature = window.requestFeature(Window.FEATURE_CUSTOM_TITLE);
}
setContentView(layoutId);
if (useTitleFeature) {
window.setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.window_title);
}
May be you find this problem when use it in tab,for there already have a title and you can not add a custom title again.
you should add this custom title in the activity which you get the Tab
I did exactly as Sunny Dasari did but with one small change I put the # before and android in the parent attribute.
So my code looked like this.
<style name="CustomTheme" parent="#android:Theme">
To avoid crashing, you can simply add
android:theme="#style/android:Theme"
to the <Activity> tag in your AndroidManifest.xml:
<activity
android:name="test.TestActivity"
android:label="#string/app_name"
android:theme="#style/android:Theme">
This is because the styles defined in your default theme conflict with FEATURE_CUSTOM_TITLE (such as the attribute android:windowNoTitle). By using another theme, you can avoid such problems.
However, you might further need to define your own theme to change other attributes, such as android:windowTitleSize, background color, text color and font, etc. In this case, you can derive your theme from an existing theme (e.g., Theme.Light) and modify its attributes:
<resources>
<style name="CustomWindowTitleBackground">
<item name="android:background">#323331</item>
</style>
<style name="CustomTheme" parent="#style/android:Theme.Light">
<item name="android:windowNoTitle">false</item>
<item name="android:windowTitleSize">60dip</item>
<item name="android:windowTitleBackgroundStyle">#style/CustomWindowTitleBackground</item>
</style>
</resources>
Try swapping following lines:
setContentView(R.layout.workorder_list);
this.getWindow().setFeatureInt(Window.FEATURE_CUSTOM_TITLE, R.layout.workorder_list_titlebar);
I have run into this issue as well and it looks like it is an issue with what theme is applied to an activity in the AndroidManifest.xml file. If I use a theme like:
android:theme="#android:style/Theme.Holo
Then it will throw the error
android.util.AndroidRuntimeException: You cannot combine custom titles with other title features
However if I use a different theme like:
android:theme="#android:style/Theme.Black"
then it will not throw the error and subsequently will not crash. However I am trying to use a theme like Theme.Holo. I'm not sure if there is a way around this.
Since, I was trying to compile my program in android 4.0, I was facing the same problem. None of these solutions helped.So, I copied my style contents from values > styles.xml and pasted it in values-v11 styles.xml file and values-v14 styles.xml file. Bingo, the trick worked.
As a beginner most of the answers didn't help me for my case. So here is my answer.
Go to res/values folder in your android project and check for strings.xml (this file may vary in your case, something like themes.xml)
Inside the file under resource tag check whether you have style tags. If you don't find it, add the code below as mentioned below as a child to resources tag
something like below
<resources>
<style name="SomeNameHere">
<item name="android:windowNoTitle">true</item>
</style>
</resources>
if you already have style tag, just add the code below to your style tag
<item name="android:windowNoTitle">true</item>

Android Lollipop Material Design Overflow Menu Icon color

I try the new Material Design on a Nexus 7 and have the following strange behaviour. The Overflow Menu Icon has a different color on the first app launch.
I changed the android:textColorPrimary color and read this tutorial.
First App launch:
Second App launch:
As you see the color of the primary text color is not set on the first launch. It is only set if i press the home button and relaunch the app. Here is my styles.xml file:
<style name="AppBaseTheme" parent="android:Theme.Material.Light">
<item name="android:colorPrimary">#FF4444</item>
<item name="android:colorPrimaryDark">#CC0000</item>
<item name="android:textColorPrimary">#000000</item>
</style>
Can someone explain, why that behaviour occurs?
I set android:minSdkVersion="21" and don't want to use support libraries.
I experienced the same problem when running a PreferenceActivity which cannot use appcompat-v7 library on a LOLLIPOP device. When this activity is opened for the first time the overflow icon is always white completely ignoring android:textColorPrimary and android:colorControlNormal. Subsequent runs or orientation changes however result in proper coloring.
I created a gist which will help you mitigate this. The code binds a global layout observer to the toolbar and when it finds an overflow icon it replaces it and unbinds the observer. So don't use it in places where you don't expect an overflow icon because the observer won't get unbound in that case.
Link to gist: https://gist.github.com/consp1racy/4b640679de553fdb3046
Just add the secondary text color for the options menu, i.e.:
<item name="android:textColorSecondary">#color/text_color</item>
In some circumstances the secondary color is set to the primary color. I don't know yet why.
Add these items too:
<item name="actionMenuTextColor">#color/white</item>
<item name="android:actionMenuTextColor">#color/white</item>
If this didn't help, then try this:
<style name="AppBaseTheme" parent="android:Theme.Material.Light">
<item name="android:itemTextAppearance">#style/TextAppearance</item>
</style>
<style name="TextAppearance">
<item name="android:textColor">#android:color/white</item>
</style>
This would works for Holo.Light.DarkActionBar
If you want to use material design in pre-21 devices you need to extend Theme.AppCompat.Light.NoActionBar theme. To do that, you need to add compile com.android.support:appcompat-v7:21.0.0 as a dependency of your project, this way you will be able to use the Toolbar in your layout.
Then define your theme in values/themes.xml::
<style name="Theme.MyTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- colorPrimary is used for the default action bar background -->
<item name="colorPrimary">#color/my_awesome_color</item>
<!-- colorPrimaryDark is used for the status bar -->
<item name="colorPrimaryDark">#color/my_awesome_darker_color</item>
<!-- colorAccent is used as the default value for colorControlActivated
which is used to tint widgets -->
<item name="colorAccent">#color/accent</item>
<!-- You can also set colorControlNormal, colorControlActivated
colorControlHighlight & colorSwitchThumbNormal. -->
</style>
and your the toolbar in your layout/my_activity.xml:
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/my_awesome_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
You have optional attrs to define the theme and popupTheme as well:
app:theme="#style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="#style/ThemeOverlay.AppCompat.Light"
Chris Banes wrote a good article about this that you should read https://chris.banes.me/2014/10/17/appcompat-v21/
I read on the comments of the questions that you are using eclipse, I highly recommend to use android studio + gradle and no eclipse.
Just add android:theme="#style/ThemeOverlay.AppCompat.Dark"to the Toolbar
<android.support.v7.widget.Toolbar
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/my_awesome_toolbar"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:theme="#style/ThemeOverlay.AppCompat.Dark
android:minHeight="?attr/actionBarSize"
android:background="?attr/colorPrimary" />
overflow menu icon will be white now :)

Categories

Resources