Android Borderless Dialog - android

I have created an AlertDialog using AlertDialog.Builder, but the Dialog border takes up too much space on the screen. How do I remove the border? I have tried using another Activity to emulate the dialog with a transparent background, but the dialog is used repeatedly, and creating a new Activity every time introduces a significant amount of lag.
The answer from here mentions that it can be found in the ApiDemos, but i can't seem to find it.

Alright, I'll answer my own question. Basically, instead of using AlertDialog.Builder, create a regular Dialog using it's constructor, and use a suitable theme instead of the default Dialog theme.
So your code would look something like this:
Dialog dialog = new Dialog(this, android.R.style.Theme_Translucent_NoTitleBar);
Hope this helps someone else.

Here is my solution, to get a dialog that shows only your content.
Dialog dialog = new Dialog(this,R.style.ThemeDialogCustom);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
//you can move the dialog, so that is not centered
// dialog.getWindow().getAttributes().y = 50; //50 should be based on density
dialog.setContentView(yourLinearLayout);
dialog.setCancelable(true);
//dialog.setOnCancelListener(cancelListener);
dialog.show();
themes.xml // located in project /res/values
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="ThemeDialogCustom">
<item name="android:windowFrame">#null</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowAnimationStyle">#android:style/Animation.Dialog</item>
<item name="android:windowBackground">#color/transparent_color</item>
<item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
<item name="android:colorBackgroundCacheHint">#null</item>
</style>
</resources>
colors.xml // also located there
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="transparent_color">#00000000</color>
</resource>

Using android.R.style.Theme_Translucent_NoTitleBar works if you want the dialog to be full screen. An alternative is to create your own style, like so:
<style
name="Theme_Dialog_Translucent"
parent="android:Theme.Dialog">
<item
name="android:windowBackground">#null</item>
</style>

try this :D
Dialog popUpView= new Dialog(this);
popUpView.getWindow().setBackgroundDrawable(new ColorDrawable(0));

I added a transparent pixel to drawable and used the following code :
dialog.getWindow().setBackgroundDrawableResource(R.drawable.transpix);

if you have 2 border you need to use a ContextThemeWrapper, which it will show only one border as you would like :)
ContextThemeWrapper wrapper = new ContextThemeWrapper(this, android.R.style.Theme_Holo);
final LayoutInflater inflater = (LayoutInflater) wrapper.getSystemService(LAYOUT_INFLATER_SERVICE);
AlertDialog.Builder builder = new AlertDialog.Builder(wrapper);

You can ask the builder to enforce inverse background. Worked for me to display a borderless splash screen with a png source.

In your resources file create a xml file named for e.g. null_image.xml, with the following content:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#0000" />
<size
android:height="1dp"
android:width="1dp" />
</shape>
In your java code, fetch the dialog window and set the xml file as the drawable resource, like this:
Depending on your context:
Dialog dialog = new Dialog(getContext());
Window window = dialog.getWindow();
window.setBackgroundDrawableResource(R.drawable.null_image);
That's it, enjoy.

Related

Different Color Background in my AlertDialog in Kotlin

A very weird thing is happening with my custom Alert dialog. Same code when run different times, yields different background color of the Alert Dialog layout, of which most of the times the color is red (out of no where!), even though I have used a different background to the layout. Take a look at my code first.
This is the layout for the AlertDialog(layout_add_url.xml)
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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_margin="#dimen/_10sdp"
android:id="#+id/url_layout_constraint"
android:background="#drawable/background_note"
android:layout_height="wrap_content">
//Some ImageViews and TextViews here
This is what layout_add_url.xml has finally
Now,
This is the background_note.xml
<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="rectangle" xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#333333"/> //Note that the color here is black
<corners android:radius="#dimen/_10sdp"/>
</shape>
This is where I have finally created the AlertDialog in my Kotlin Activity
val inflater = layoutInflater
val view = inflater.inflate(R.layout.layout_add_url, null)
val infoDialogBuilder = AlertDialog.Builder(this#CreateNotesActivity)
infoDialogBuilder.setView(view)
val infoDialog = infoDialogBuilder.create()
infoDialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))
infoDialog.setContentView(view)
infoDialog.show()
But after Running the project on a real device. It looks like this
Note
I have noticed that when I change the android:background="#drawable/background_note" to android:background="#333333" the code then seems to work fine
You could try to set the background of your dialog via a style property and use the MaterialAlertDialogBuilder.
Remove the android:background="#drawable/background_note" property from the ConstraintLayout in layout_add_url
Define your dialog style in style.xml:
<style name="style_dialog" parent="ThemeOverlay.MaterialComponents.Dialog.Alert">
<item name="shapeAppearanceMediumComponent">#style/style_dialog_background</item>
<item name="colorSurface">#333333</item>
</style>
<style name="style_dialog_background" parent="ShapeAppearance.MaterialComponents.MediumComponent">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">#dimen/_10sdp</item>
</style>
Then create your dialog by calling:
val dialogView = layoutInflater.inflate(R.layout.layout_add_url, null)
MaterialAlertDialogBuilder(this#CreateNotesActivity, R.style.style_dialog)
.setView(dialogView)
.create().apply {
show()
}

How to remove transparent dark background outside of dialog box

I want to remove a transparent dark backgrond outside of dialog box.
I tried with:
final Dialog dialog = new Dialog(this);
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.WHITE));
this.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.WHITE));
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.spinner_layout);
getWindow().getDecorView().setBackgroundResource(android.R.color.transparent);
In addition to chuky's answer;
If your minSdkVersion value is greater than or equal to 14, you can use setDimAmount() method.
dialog.getWindow().setDimAmount(float amount);
According to reference;
amount The new dim amount, from 0 for no dim to 1 for full dim.
or
As stated previously, you can clear window flag.
Your question has already been answered here
Code from the link:
Add this to your styles.xml:
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.DoNotDim" parent="android:Theme">
<item name="android:backgroundDimEnabled">false</item>
</style>
</resources>
And then apply the theme to your activity:
<activity android:name=".SampleActivity" android:theme="#style/Theme.DoNotDim">
Hope this will help you...
dialog.getWindow().getDecorView().setBackgroundResource(android.R.color.transparent);
dialog.getWindow().setDimAmount(0.0f);
dialog.show();
This didn't work for me
<item name="android:backgroundDimEnabled">false</item>
i used background dim amount instead of background dim enabled
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="Theme.DoNotDim" parent="android:Theme">
<item name="android:backgroundDimAmount">0</item>
</style>
</resources>
Using dialog.getWindow().setDimAmount(float amount); caused my statusbar icons to disappear.
Clearing the FLAG_DIM_BEHIND flag from window worked for me.
dialog.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);

Create a transparent dialog on top of activity

Background
I'm trying to put a layer on top of the current activity which would have explanation of what is going on on the current screen, similar to what occurs on contact+ app .
I know there are some solutions for this (like the showCase library and the superToolTips library ) , and I also know that I can create a view and set it on top by adding it to the window of the activity , but I need put a whole dialog layer on top.
Problem
No matter what I try, each solution doesn't work the way I need it to work.
in short , what I need is:
full screen dialog.
no change (not visual and not logical) to the action bar, notification bar, and content of the activity behind, meaning that everything behind the dialog stays the same it was shown a moment before the dialog was shown.
be transparent except for the views I use for the dialog, which should be shown normally.
what I've tried
Sadly, I've always got only a part of the things I needed.
here's my code:
styles.xml:
<style name="full_screen_dialog">
<item name="android:windowFrame">#null</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowAnimationStyle">#android:style/Animation.Dialog</item>
<item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
</style>
MainActivity.java:
...
final Dialog dialog = new Dialog(this, R.style.full_screen_dialog);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.floating_tutorial);
dialog.getWindow().setLayout(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
dialog.getWindow().setFormat(PixelFormat.TRANSLUCENT);
dialog.show();
This code will put the layout on top of the activity, but sadly it doesn't have any transparency , even though I've set it . The layout I've used is very simple which is why I don't post it.
Question
what am I missing ? what should be done to fix the code?
how can I make the dialog both transparent, full screen AND that it won't change the action bar and notifications bar.
Working solution
EDIT: after finding a good solution, here's the working code:
#Override
protected void onCreate(final Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final Dialog dialog = new Dialog(this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.floating_tutorial);
final Window window = dialog.getWindow();
window.setLayout(WindowManager.LayoutParams.MATCH_PARENT, WindowManager.LayoutParams.MATCH_PARENT);
window.clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);
window.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
dialog.show();
}
Just change the background color of your Dialog:
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
Edit:
This prevents the dim effect:
dialog.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);
Just add this, it really works!
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowCloseOnTouchOutside">true</item>
<item name="android:windowBackground">#android:drawable/alert_dark_frame</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowNoTitle">true</item>
<item name="android:windowIsFloating">true</item>
<item name="android:backgroundDimEnabled">false</item>

Dialog in full Screen

My question is i don't want to show transparent dialog in full screen
below is the code i used
dialog = new Dialog(this, R.style.CustomDialogTheme);
dialog.setContentView(R.layout.enterjoinseecode_dialog);
CustomDialog theme
<style name="CustomDialogTheme" parent="#android:style/Theme.Translucent.NoTitleBar">
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowFullscreen">false</item>
</style>
Please some one helps me where i went wrong
Try this.Create your view for Dialog like below.
<RelativeLayout
android:layout_width="450dp"
android:layout_height="250dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:orientation="vertical" >
// Here you can add your component.
</RelativeLayout>
And set your dialog this view.
dialog = new Dialog(this, R.style.CustomDialogTheme);
dialog.setContentView(R.layout.enterjoinseecode_dialog);
That's it.Hope this will help you.
Create a activity with transparent background and for that particular activity define theme like this
<activity android:theme="#android:style/Theme.Dialog" />
And also if you want that activity to be exactly like dialog, then you can also use this
android:excludeFromRecents="true"
to remove it from the recent apps list.
some how with the following steps got the dialog with transparent effect with out full screen
No need of defining style "CustomDialogTheme" need to pass the theme argument for constructor as android.R.style.Theme_Translucent_NoTitleBar
and with in inflated xml just used background as android:background="#29000000" to make it transparent effect and layout_gravity property to position the dialog
if i use the above style CustomDialogTheme somehow its showing as a window instead of dialog because of that i applied direct theme to show that as dialog (not full screen)and to make it transparent effect with in xml i set the property background

Custom ProgressDialog extends Dialog or ProgressDialog?

I am simply trying to create a spinning progress dialog. No text, no borders, no background. Just a spinning notification that lightly is center on the screen on top of content.
I have seen two different Stack Overflow questions in creating this custom Dialog.
They both use this styling:
<style name="NewDialog" parent="#android:style/Theme.Dialog">
<item name="android:windowFrame">#null</item>
<item name="android:windowBackground">#android:color/transparent</item>
<item name="android:windowIsFloating">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:windowTitleStyle">#null</item>
<item name="android:colorBackground">#ffffff</item>
<item name="android:windowAnimationStyle">#android:style/Animation.Dialog</item>
<item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:width">600dip</item>
<item name="android:height">100dip</item>
<item name="android:textColor">#FF0000</item>
</style>
But in the Java side, one extends Dialog and contains lots of custom content, the other one is simply this:
public class MyProgressDialog extends ProgressDialog {
public MyProgressDialog(Context context) {
super(context, R.style.NewDialog);
}
}
On the first (extends Dialog), I get a blank. No dialog. Nothing. On the code sample just above, I get a shrunken small dialog spinning inside a black box that is off centered.
Which method is more correct and can I have a sample on how to implement this?
Also, how can I make that dialog transparent/borderless?
The 'right way' to do this now would be to extend DialogFragment http://developer.android.com/reference/android/app/DialogFragment.html
If you are not using the compatibility library, you are not programming in the current Android world.
If you want to extend Dialog, then I have some example code here: https://github.com/tom-dignan/nifty/tree/master/src/com/tomdignan/nifty/dialogs In this code, I implemented a kind of 'progress dialog' by extending Dialog. I extended Dialog because I wanted full control and wanted my Dialog to be full-screen.
I would recommend reading the above DialogFragment doc and using that, though.
So really, there is no right or wrong way here. Extending any of the three classes will work, but the cleanest and most current would be the DialogFragment approach.
One way of doing it is to use a custom dialog, request feature No_Title and set the background drawable resource to transparent.
You can use the following code, I just wrote and tested it out on Android 4.0.3 ICS.
The xml layout in layout folder is, say dialog_progress.xml
<?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="match_parent"
android:orientation="vertical">
<ProgressBar
android:id="#+id/dialogProgressBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"/>
</LinearLayout>
The java code to display the dialog and make it transparent is as follows.
Dialog dialog = new Dialog (this);
dialog.requestWindowFeature (Window.FEATURE_NO_TITLE);
dialog.setContentView (R.layout.dialog_progress);
dialog.getWindow ().setBackgroundDrawableResource (android.R.color.transparent);
dialog.show ();
Something similar can be achieved very easily by using frame-by-frame animation on an ImageView instead of making custom progress dialog. For this you just need a sequence of images(can be extracted from any gif). And then you can apply frame-by-frame animation on it. It will do exactly what you want.
I have done something similar with the code below -:
// XML for frame by frame animation
<animation-list xmlns:android="http://schemas.android.com/apk/res/android"
android:oneshot="false" >
<item
android:drawable="#drawable/frame00"
android:duration="150"/>
<item
android:drawable="#drawable/frame01"
android:duration="150"/>
<item
android:drawable="#drawable/frame02"
android:duration="150"/>
<item
android:drawable="#drawable/frame03"
android:duration="150"/>
<item
android:drawable="#drawable/frame04"
android:duration="150"/>
<item
android:drawable="#drawable/frame05"
android:duration="150"/>
<item
android:drawable="#drawable/frame06"
android:duration="150"/>
Java code for starting animation :-
ImageView iv = (ImageView)findViewById(R.id.progressDialog);
iv.setBackgroundResource(R.anim.progress_dialog_icon_drawable_animation);
AnimationDrawable aniFrame = (AnimationDrawable) iv.getBackground();
aniFrame = (AnimationDrawable) iv.getBackground();
aniFrame.start();
Hope it helps !

Categories

Resources