My own AppcompatDialog generates a really ugly shadow/elevation - java

I tried to create my own custom loading dialog on android. That was no problem, but the dialog creates a really ugly shadow when it appears
I tried to use a default color theming my android and not my own. And i tried to set a transparent windows background and set the elevation already to 0dp
Screenshot
enter link description here
styles.xml
<style name="AppTheme.Dark" parent="Theme.AppCompat.NoActionBar">
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
<!--<item name="android:windowBackground">#color/colorPrimary</item>-->
<item name="android:windowBackground">#color/colorAccent</item>
</style>
<style name="AppTheme.Dark.Loading.Dialog" parent="Theme.AppCompat.Dialog.Alert">
<item name="android:windowBackground">#android:color/transparent</item>
<item name="colorAccent">#color/colorAccent</item>
<item name="android:textColorPrimary">#FFFFFF</item>
<item name="android:background">#color/colorPrimary</item>
</style>
dialog-layout.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:theme="#style/AppTheme.Dark.Loading.Dialog"
android:padding="16dp"
>
<TextView
android:id="#+id/text_view_loading_dialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Authenticating..."
android:textSize="16sp"
android:textStyle="bold"
android:gravity="center"
/>
<ProgressBar
android:id="#+id/progress_bar_loading_dailog"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_toRightOf="#id/text_view_loading_dialog"
android:indeterminate="true" />
</LinearLayout>
Dialogclass
public class LoadingDialog extends AppCompatDialogFragment {
private TextView messageTextView;
#Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
LayoutInflater inflater = getActivity().getLayoutInflater();
View view = inflater.inflate(R.layout.layout_loading_dialog, null);
builder.setView(view);
messageTextView = view.findViewById(R.id.text_view_loading_dialog);
return builder.create();
}
Activity
LoadingDialog loadingDialog = new LoadingDialog();
loadingDialog.show(getSupportFragmentManager(), "loading dialog");
I expected a normal black or light grey shadow, like the depracted ProgressDialog by Google

In your activity, add the clearFlags() method, like this:
LoadingDialog loadingDialog = new LoadingDialog();
loadingDialog.getWindow().clearFlags(LayoutParams.FLAG_DIM_BEHIND);
loadingDialog.show(getSupportFragmentManager(), "loading dialog");

Yes that helps! Thank you very much. But removing this flag, remoes the whole dimming background. I build a workaround with a invisible dimmed View on my activity, which i make visible everytime my dialog pops up.
I added that to my activity layout
<View
android:id="#+id/dimBackground"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/colorDimBackground"
android:visibility="invisible">
</View>
My color is this:
<color name="colorDimBackground">#B3000000</color>
The #B3 is the hexcode for 70% opacity. You can find the a table with all hex values here:
Hex values for opacity
And before a I show the dialog, i make the view visible
findViewById(R.id.dimBackground).setVisibility(View.VISIBLE);
LoadingDialog loadingDialog = new LoadingDialog();
loadingDialog.show(getSupportFragmentManager(), "loading dialog");
Maybe there is a more practical solution for this problem, but i have no idea!?
This is the result:

Related

Extra end and start margin with chips

How can i remove extra margins or (spacing) from chips inside chip group?
below is all things that i try in styles,code and xml none of these work for me.
Here is how it's looks:
And here is what i try and my code:
<HorizontalScrollView
android:id="#+id/horizontalScrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="none"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tagsRecyclerView">
<com.google.android.material.chip.ChipGroup
android:id="#+id/subTagsChips"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:singleLine="true">
</com.google.android.material.chip.ChipGroup>
</HorizontalScrollView>
Here is how i add chips to the group
private fun generateChips(chipsList:ArrayList<SubTag>):ArrayList<Chip>{
val list = arrayListOf<Chip>()
chipsList.forEach { subTag ->
val generatedChip = Chip(requireContext())
generatedChip.apply {
text = subTag.tag
setTextColor(ContextCompat.getColorStateList(requireContext(),R.color.chip_text_color))
val drawable = ChipDrawable.createFromAttributes(context, null, 0,
R.style.ChipsStyle)
setChipDrawable(drawable)
}
list.add(generatedChip)
}
return list
}
And here is my chips style
<style name="ChipsStyle" parent="Widget.MaterialComponents.Chip.Choice">
<item name="chipBackgroundColor">#color/chip_state_bc</item>
<item name="checkedIconTint">#color/white</item>
<item name="chipCornerRadius">5dp</item>
<item name="chipSpacingHorizontal">0dp</item>
<item name="android:layout_margin">0dp</item>
<item name="ensureMinTouchTargetSize">false</item>
</style>
I found this answer from material-components/material-components-android repo and worked for me.
there's a flag on by default to ensure that chips meet Android's minimum recommended touch size. You can disable it by setting ensureMinTouchTargetSize == false
source: https://github.com/material-components/material-components-android/issues/1445

How to get Logo in Action Bar on left side?

public class MainActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
ActionBar saadaAB = getSupportActionBar();
saadaAB.setLogo(R.drawable.run);
saadaAB.setDisplayUseLogoEnabled(true);
saadaAB.setDisplayShowHomeEnabled(true);
}
}
I want to print a logo in action bar in my app but this code make that logo in center and remove text in action bar.
you can achieve it in 2 ways
1. if Apptheme is in
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">#color/colorPrimary</item>
<item name="colorPrimaryDark">#color/colorPrimaryDark</item>
<item name="colorAccent">#color/colorAccent</item>
</style>
You can just call
getSupportActionBar().setHomeAsUpIndicator(R.drawable.squarebox);// set drawable icon
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
2. or you can customize toolbar like
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:id="#id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"/>
</android.support.design.widget.AppBarLayout>
<!-- Here goes your UI -->
</LinearLayout>
with java
Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
toolbar.setNavigationIcon(R.drawable.custom_icon);

Transparent background for custom AlertDialog

Strangely, this was working fine, this is how it looks on my app released on Google Play:
And this is how it looks now:
All I did was migrate to AndroidX.
Here is my dialog layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/dialogLinear"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="10dp">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:background="#drawable/rounded_corners">
<Button
android:id="#+id/btnAdd2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:text="#string/import_video"
android:textColor="#color/dark_text" />
</FrameLayout>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rounded_corners">
<Button
android:id="#+id/btnAdd1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?android:attr/selectableItemBackground"
android:text="#string/add_student"
android:textColor="#color/dark_text" />
</FrameLayout>
</LinearLayout>
and here is how I inflate it:
View dialogView = View.inflate(getApplicationContext(), R.layout.dialog_main, null);
LinearLayout dialogLinear = dialogView.findViewById(R.id.dialogLinear);
//Here is where is set the background to transparent
dialogLinear.setBackgroundColor(0x00000000);
final AlertDialog alertD = new AlertDialog.Builder(this).create();
Button btnAdd1 = dialogView.findViewById(R.id.btnAdd1);
Button btnAdd2 = dialogView.findViewById(R.id.btnAdd2);
btnAdd1.setTypeface(mCustom_font_Bold);
btnAdd2.setTypeface(mCustom_font_Bold);
btnAdd1.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
//Do stuff
}
});
btnAdd2.setOnClickListener(new View.OnClickListener() {
public void onClick(View v) {
//Do stuff
}
});
alertD.setView(dialogView);
if (alertD.getWindow() != null) {
alertD.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
}
alertD.show();
I searched and couldn't find why this would be happening. Can someone please give me some advise?
I have tried setting it in in the layout itself.
Edit 1:
After trying the answer below, it now looks like this, instead of above:
I resolved it by adding the following styles:
<style name="NewDialog">
<item name="android:windowIsFloating">true</item>
<item name="android:windowAnimationStyle">#android:style/Animation.Dialog</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:background">#android:color/transparent</item>
</style>
Setting the style like this:
final AlertDialog alertD = new AlertDialog.Builder(this, R.style.NewDialog).create();
And to fix what happened in Edit 1, i changed my LinearLayout to a RelativeLayout
You Can Create a theme and assign that theme to your AlertDialog
Define theme in your styles.xml
<style name="CustomDialog" parent="android:Theme.Dialog">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">#android:color/transparent</item>
</style>
And Assign that theme to your AlertDialog
final AlertDialog alertD = new AlertDialog.Builder(this,R.style.CustomDialog).create();
Or
2.You should try and use Dialog instead of AlertDialog
As Explained in this Answer.

How to Set Background Color TabHost

I need help, I'm finding difficulty for change background color in a TabHost.
Original Image:
I need to modify background color like image below.
I tried many things in my code and XML too, but failed.
My code below:
TabHost tabHost = getTabHost();
// Tab 1
TabSpec aba1spec = tabHost.newTabSpec("Tab 1");
// setting Title and Icon for the Tab
tabHost.getTabWidget().setStripEnabled(false);
aba1spec.setIndicator("",getResources().getDrawable(R.drawable.tabenviaarq));
Intent photosIntent = new Intent(this, MainActivity.class);
aba1spec.setContent(photosIntent);
// Adding all TabSpec to TabHost
tabHost.addTab(aba1spec); // Adding tab1
in XML i have this:
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#android:id/tabs"
android:layout_alignParentTop="true"/>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:layout_alignParentBottom="true"
android:layout_marginBottom="-5dp"
android:background="#000000"/>
</RelativeLayout>
</TabHost>
Somebody have some idea i thanks a lot.
tabHost.setOnTabChangedListener(new OnTabChangeListener() {
public void onTabChanged(String arg0) {
for (int i = 0; i < tab.getTabWidget().getChildCount(); i++) {
tab.getTabWidget().getChildAt(i)
.setBackgroundResource(R.drawable.tab_selected); // unselected
}
tab.getTabWidget().getChildAt(tab.getCurrentTab())
.setBackgroundResource(R.drawable.tab_unselected); // selected
}
});
Try this method, I hope this will help you.
Solution is to use background with selector, and the code is here:
private void initTabsAppearance(TabWidget tabWidget) {
// Change background
for(int i=0; i < tabWidget.getChildCount(); i++)
tabWidget.getChildAt(i).setBackgroundResource(R.drawable.tab_bg);
}
Where tab_bg is an xml drawable with selector:
For the full Tab customization I will add the code for changing tab text style using custom theme. Add this to styles.xml:
<style name="MyCustomTheme" parent="#android:style/Theme.Light.NoTitleBar">
<item name="android:tabWidgetStyle">#style/CustomTabWidget</item>
</style>
<style name="CustomTabWidget" parent="#android:style/Widget.TabWidget">
<item name="android:textAppearance">#style/CustomTabWidgetText</item>
</style>
<style name="CustomTabWidgetText" parent="#android:style/TextAppearance.Widget.TabWidget">
<item name="android:textSize">12sp</item>
<item name="android:textStyle">bold</item>
</style>
To use this theme, define it in AndroidManifest.xml:
<application android:theme="#style/MyCustomTheme">
And now you have tab widgets with custom background and custom text style.
I am solved exactly the same problem with this method:
private void setBackgroundColor() {
int inactiveColor = getResources().getColor(R.color.inactive_tab);
int activeColor = getResources().getColor(R.color.active_tab);
// In this loop you will set the inactive tabs backgroung color
for (int i = 0; i < tabWidget.getChildCount(); i++) {
tabWidget.getChildAt(i).setBackgroundColor(inactiveColor);
}
// Here you will set the active tab background color
tabWidget.getChildAt(tabHost.getCurrentTab()).setBackgroundColor(
activeColor);
}

Android - Styling Spinner within TabView

I've got an app that uses tabs for navigation, and on one of those tabs there is a spinner. However, when the spinner is selected and the actual select window comes up, all the text is white on a white background.
I've tried styling the layout but nothing I do changes the color of the font.
the main class
public class RealmsOfWickedry extends TabActivity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.tab);
TabHost tabHost = (TabHost)findViewById(android.R.id.tabhost);
TabSpec firstTabSpec = tabHost.newTabSpec("tid1");
TabSpec secondTabSpec = tabHost.newTabSpec("tid1");
firstTabSpec.setIndicator("Home").setContent(new Intent(this,FirstTab.class));
secondTabSpec.setIndicator("Catalog").setContent(new Intent(this,SecondTab.class));
tabHost.addTab(firstTabSpec);
tabHost.addTab(secondTabSpec);
}
public static View makeSpinner(Context context) {
View v = LayoutInflater.from(context).inflate(R.layout.spinner, null);
Spinner spinner = (Spinner) v.findViewById(R.id.spinner);
ArrayAdapter<String> adapter = new ArrayAdapter<String>(context, android.R.layout.simple_spinner_dropdown_item);
adapter.add("Item 1");
adapter.add("Item 2");
adapter.add("Item 3");
adapter.add("Item 4");
spinner.setAdapter(adapter);
return v;
}
}
the class with the spinner
public class SecondTab extends Activity {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
/* Second Tab Content */
TextView textView = new TextView(this);
textView.setText("Choose a Category");
setContentView(textView);
setContentView(RealmsOfWickedry.makeSpinner(getParent()));
}
}
tab.xml
<?xml version="1.0" encoding="utf-8"?>
<TabHost android:layout_width="fill_parent"
android:layout_height="fill_parent" xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#android:id/tabhost">
<LinearLayout android:id="#+id/LinearLayout01"
android:orientation="vertical" android:layout_height="fill_parent"
android:layout_width="fill_parent">
<TabWidget android:id="#android:id/tabs"
android:layout_height="wrap_content" android:layout_width="fill_parent"></TabWidget>
<FrameLayout android:id="#android:id/tabcontent"
android:layout_height="fill_parent" android:layout_width="fill_parent"></FrameLayout>
</LinearLayout>
</TabHost>
spinner.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Spinner
android:id="#+id/spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:prompt="#string/cat_prompt"
android:theme="#style/DropdownStyle"
/>
</LinearLayout>
themes.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="OverallStyle" parent="#android:Theme.Light">
<item name="android:windowBackground">#drawable/bg</item>
<item name="android:textColor">#color/white</item>
</style>
<style name="WelcomeStyle" parent="#android:Theme.Light">
<item name="android:typeface">monospace</item>
<item name="android:gravity">center</item>
</style>
<style name="CustomStyle" parent="#android:Theme.Light">
<item name="android:typeface">monospace</item>
<item name="android:gravity">top</item>
</style>
<style name="DropdownStyle" parent="#android:Theme.Light">
<item name="android:textColor">#color/red</item>
</style>
</resources>
Can anyone help me out with this?
It looks like you're trying to override the system theme to show a different color which is the right path to be on. Your spinner xml contains a reference to android:theme I haven't see that one before and it doesn't appear to be part of the API for this widget. To get your DropdownStyle to work, first, add it as part of your OverallStyle style with an item name of #android:attr/spinnerDropDownItemStyle. Second, change DropdownStyle's parent to #android:Widget.DropDownItem.Spinner. I'm assuming that OverallStyle is applied to the Activity or Application in the Manifest already. This will change the style for all Spinner drop down Items.
To apply only to this view's drop down items do only step two above then add style="#style/OverallStyle" to the spinner in its layout.
Additional Information:
<style name="DropdownStyle" parent="#android:Widget.DropDownItem.Spinner">
<item name="android:textColor">#color/red</item>
</style>
<style name="OverallStyle" parent="#android:Theme.Light">
<item name="android:windowBackground">#drawable/bg</item>
<item name="#android:attr/spinnerDropDownItemStyle">#style/DropdownStyle</item>
<item name="android:textColor">#color/white</item>
</style>
-OR-
themes.xml
<style name="DropdownStyle" parent="#android:Widget.DropDownItem.Spinner">
<item name="android:textColor">#color/red</item>
</style>
spinner.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Spinner
android:id="#+id/spinner"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:prompt="#string/cat_prompt"
style="#style/DropdownStyle"
/>
</LinearLayout>

Categories

Resources