How to show custom dialog at Center Vertical - android

See the screen shot the dialog is not showing center vertically and unexpected margin
I have tried many example but no one solve this.
please refer to screen shot so you will understand very easy,what my problem is.
"As you see - Dialog appear with unexpected margin"
i have also try this
Window window = dialog.getWindow();
window.setLayout(AppBarLayout.LayoutParams.WRAP_CONTENT,
AppBarLayout.LayoutParams.WRAP_CONTENT);
window.setGravity(Gravity.CENTER);
java code is -
final Dialog dialog = new Dialog(MainActivity.this);
dialog.setContentView(R.layout.dialogforgot_password);
final EditText et_emailforgot = (EditText)dialog.findViewById(R.id.et_EnterMail);
final Button bt_SubmitForgotPass = (Button)dialog.findViewById(R.id.bt_SubmitForgotButton);
final TextView ForgotHeading = (TextView)dialog.findViewById(R.id.tv_forgotpasswordHeading);
final TextView PleaseEnterurMail = (TextView)dialog.findViewById(R.id.tv_Enteruremail);
et_emailforgot.setTypeface(Lato_Regular);
PleaseEnterurMail.setTypeface(Lato_Regular);
ForgotHeading.setTypeface(Lato_Bold);
bt_SubmitForgotPass.setTypeface(Lato_Bold);
dialog.show();
and my XML file is as Follows:
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/rounded_windowcorner"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:background="#drawable/rounded_headingcorner"
android:layout_alignParentTop="true"
android:id="#+id/RLForgot">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Forgot Password"
android:textColor="#ffffff"
android:textSize="16dp"
android:id="#+id/tv_forgotpasswordHeading"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true" />
</RelativeLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Please Enter Your Registered Email id"
android:textColor="#000000"
android:textSize="17dp"
android:layout_marginRight="22dp"
android:layout_marginLeft="22dp"
android:id="#+id/tv_Enteruremail"
android:layout_centerHorizontal="true"
android:layout_below="#+id/RLForgot"
android:layout_marginTop="20dp"
android:textAlignment="center"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="50dp"
android:textAlignment="center"
android:id="#+id/et_EnterMail"
android:hint="Enter Your Email Id Here"
android:singleLine="true"
android:background="#drawable/custom_spinner_background"
android:layout_centerHorizontal="true"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="40dp"
android:layout_below="#+id/tv_Enteruremail"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="40dp"
android:text="Submit"
android:background="#drawable/signin_btn"
android:textColor="#color/signinlogcolor"
style="?android:attr/borderlessButtonStyle"
android:id="#+id/bt_SubmitForgotButton"
android:layout_marginTop="30dp"
android:layout_marginBottom="10dp"
android:layout_below="#+id/et_EnterMail"
android:layout_centerHorizontal="true" />
</RelativeLayout>

what my problem is. "As you see - Dialog appear with unexpected margin"
it is called Dialog title Use dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
to remove title from Dialog like below code
Try this
final Dialog dialog = new Dialog(MainActivity.this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.dialogforgot_password);

There isn't any unexpected margin in your dialog
Your dialog is already aligned center vertically. Because you have the title bar, it seems off.
Put
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
after the dialog initialization

Related

Dialog not showing its contents

I have a problem with this specific dialog, I implemented it as an option to be shown in the Options Menu in my toolbar but it doesn't show the dialog's contents when I clicked on the option. I have tried these with other dialog layouts I have implemented and all of them work when I implemented them here so I have a hunch that the problem is with the XML layout but I can't seem to find the problem.
Code:
else if(id == R.id.action_setting)
{
Dialog dialog = new Dialog(this);
dialog.setContentView(R.layout.dialog_settings);
dialog.setTitle("Settings");
CheckBox set_splash = dialog.findViewById(R.id.setting_check);
boolean have_splash =pref.getBoolean(SplashActivity.HAVE_SPLASH,false);
if(have_splash)
set_splash.setChecked(true);
else
set_splash.setChecked(false);
ImageButton confirm_btn = dialog.findViewById(R.id.setting_confirm);
ImageButton cancel_btn = dialog.findViewById(R.id.setting_cancel);
confirm_btn.setOnClickListener(v -> {
boolean new_splash = set_splash.isChecked();
edit.putBoolean(SplashActivity.HAVE_SPLASH,new_splash);
edit.commit();
dialog.dismiss();
});
cancel_btn.setOnClickListener(v -> dialog.dismiss());
dialog.show();
}
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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/linearLayout5">
<ImageButton
android:id="#+id/setting_confirm"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/button_highlight_dark"
android:paddingVertical="20dp"
app:srcCompat="#drawable/ic_confirm" />
<ImageButton
android:id="#+id/setting_cancel"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/button_highlight_dark"
android:paddingVertical="20dp"
app:srcCompat="#drawable/ic_cancel" />
</LinearLayout>
<TextView
android:id="#+id/setting_text"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="#color/themeDark"
android:paddingVertical="10dp"
android:paddingLeft="10dp"
android:text="#string/settings"
android:textColor="#color/white"
android:textSize="10pt"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<LinearLayout
android:id="#+id/linearLayout5"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:background="#color/themeLight"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/setting_text">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="6"
android:textColor="#color/white"
android:paddingVertical="20dp"
android:paddingLeft="10dp"
android:text="#string/splash_setting"
android:textSize="10pt" />
<CheckBox
android:id="#+id/setting_check"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>
</androidx.constraintlayout.widget.ConstraintLayout>
The match_parent parameters in your dialog are ignored. Therefore, the dialog has a width of 0.
The easiest way to get the correct height and width, is by using an AlertDialog.Builder.
If a customized AlertDialog isn't enough, you can make the dialog full size by following this answer:
Android get full width for custom Dialog
Dialog dialog = new Dialog(this);
dialog.setContentView(R.layout.dialog_settings);
Window window = dialog.getWindow();
window.setLayout(LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);

Android dialog on click take full screen (minus the keyboard)

ok so I have a custom dialog that it shows up as the left picture. And I want with a click of a button (black square) to take the full screen like the right screen but don't go behind the keyboard. How can I do this?
for now my dialog is like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/comments_relative_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF" >
<EditText
android:id="#+id/user_comments"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:gravity="top"
android:textColor="#000000" />
<TextView
android:id="#+id/char_count"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentBottom="true"
android:text="2048" />
<Button
android:id="#+id/fullscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:background="#drawable/full_screen_button_selector"
android:minHeight="1dp"
android:minWidth="1dp" />
</RelativeLayout>
I tried this on onclick but it doesn't work
RelativeLayout r = (RelativeLayout) findViewById(R.id.comments_relative_layout);
FrameLayout.LayoutParams _rootLayoutParams = new
FrameLayout.LayoutParams(ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT);
r.setLayoutParams(_rootLayoutParams);
anyone has an idea how to do this?
Try this:
myDialog.show();
Window window = myDialog.getWindow();
window.setLayout(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);

Custom AlertDialogs/Dialogs in Android appearance issues

I have implemented the following Dialog in Android but have certain problems that I cant figure out why it is happening.
I cant figure out why there is a white space at the top and the bottom corners. And how to remove it!
As i have used Dialog and not AlertDialog, this message disappears when I touch elsewhere on the screen. I want to prevent this from happening and want the message box to be closed only when the user selects any one of the two options.
How much ever I try, I am not able to get the Cancel and Erase button of the same width.
Here are the XMLs
custom_alert.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:background="#drawable/custom_alert_layout"
android:id="#+id/alert_layout"
android:paddingBottom="15dp"
android:paddingTop="10dp"
android:layout_height="wrap_content">
<ImageView
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/alert_icon_imageview"
android:src="#drawable/alerticon"
android:layout_alignParentTop="true"
android:layout_alignLeft="#+id/alert_msg"
android:layout_alignStart="#+id/alert_msg" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/alert_title"
android:text="TITLE"
android:textSize="18sp"
android:textStyle="bold"
android:textColor="#0a4d4a"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/alert_icon_imageview"
android:layout_toEndOf="#+id/alert_icon_imageview"
android:layout_marginLeft="20dp" />
<ImageView
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_marginTop="10dp"
android:layout_marginRight="4dp"
android:layout_marginLeft="2dp"
android:id="#+id/alert_divider_imageview"
android:layout_below="#+id/alert_title"
android:src="#drawable/alertdivider"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/alert_msg"
android:text="MESSAGE"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:textSize="16sp"
android:layout_below="#+id/alert_divider_imageview"
android:textColor="#ff373334"/>
<ImageView
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_marginRight="4dp"
android:layout_marginLeft="2dp"
android:layout_marginTop="10dp"
android:id="#+id/alert_divider_imageview2"
android:layout_below="#+id/alert_msg"
android:src="#drawable/alertdivider"/>
<Button
android:layout_width="150dp"
android:id="#+id/alert_cancel"
android:layout_marginLeft="10dp"
android:layout_marginRight="5dp"
android:layout_marginTop="15dp"
android:textColor="#ffffff"
android:textStyle="bold"
android:text="CANCEL"
android:background="#drawable/custom_alert_cancel"
android:layout_height="wrap_content"
android:layout_below="#+id/alert_divider_imageview2"
/>
<Button
android:layout_width="150dp"
android:id="#+id/alert_ok"
android:text="ERASE"
android:textStyle="bold"
android:layout_marginRight="10dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="15dp"
android:textColor="#ffffff"
android:background="#drawable/custom_alert_ok"
android:layout_toRightOf="#+id/alert_cancel"
android:layout_height="wrap_content"
android:layout_below="#+id/alert_divider_imageview2" />
</RelativeLayout>
custom_alert_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false" >
<shape android:shape="rectangle">
<corners android:radius="10dp"/>
<solid android:color="#139977" />
<stroke android:width="2dp" android:color="#0a4d4a" />
</shape>
</item>
</selector>
Can you post your Activity's code ?
Try this in your Activity :
final Dialog dialog = new Dialog(getActivity());
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.alert_dialog);
Button okBtn = (Button) dialog.findViewById(R.id.ok_btn);
Button cancelBtn = (Button) dialog.findViewById(R.id.cancel_btn);
okBtn.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
doErase();
}
});
cancelBtn.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
dialog.dismiss();
}
});
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
dialog.setCancelable(false);
dialog.show();
to solve 3rd problem, remove buttons from xml and use inbuild button of dialog. methods like setPositiveButton() and setNegativeButton() of dialog class.
it will give you same size button.
to solve the 1st problem you can use in xml like
<item name="android:background">#android:color/transparent</item>
or in java
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
Just add a line to your dialog box which remove your actionbar and title bar of the dialog:
Dialog dialog = new Dialog(MainActivity.this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE); //add this line
dialog.setContentView(R.layout.activity_main);
for solve your first problem add this code before setContentView
Window window = actDialog.getWindow();
WindowManager.LayoutParams wlp = window.getAttributes();
window.setAttributes(wlp);
window.setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
actDialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
your second problem solution
actDialog.setCanceledOnTouchOutside(false);
your third problem solution here
place your two Button in LinearLayout and give layout_weight same
1.To remove white space at top:
add these two lines to your dialog ,
dialog.getWindow();
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.alert_dialog);
remove white space at bottom,in your code just remove below line
<corners android:radius="10dp"/>
from your custom_alert_layout.xml file.
2.To solve second problem:add below two lines to your code,
dialog.setCancelable(false);
dialog.setCanceledOnTouchOutside(false);
3.To get same width for buttons use LinearLayout as parent for both the buttons,and give equal weights for buttons.
For your 3rd problem
here is code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal" >
<Button
android:layout_width="match_parent"
android:id="#+id/alert_cancel"
android:layout_marginLeft="10dp"
android:layout_weight="1"
android:layout_marginRight="5dp"
android:layout_marginTop="15dp"
android:textColor="#ffffff"
android:textStyle="bold"
android:text="CANCEL"
android:background="#drawable/custom_alert_cancel"
android:layout_height="wrap_content"
/>
<Button
android:layout_width="match_parent"
android:id="#+id/alert_ok"
android:text="ERASE"
android:textStyle="bold"
android:layout_weight="1"
android:layout_marginRight="10dp"
android:layout_marginLeft="5dp"
android:layout_marginTop="15dp"
android:textColor="#ffffff"
android:background="#drawable/custom_alert_ok"
android:layout_height="wrap_content"
/>
</LinearLayout>

Using LayoutInflator to create a dialog that takes up whole screen

I am designing an "about" menu for an app and have used the following code in an options menu to generate it:
case DIALOG_ABOUT:
builder = new AlertDialog.Builder(this);
Context context = getApplicationContext();
LayoutInflater inflater = (LayoutInflater) context.getSystemService(LAYOUT_INFLATER_SERVICE);
View layout = inflater.inflate(R.layout.about_dialog, null);
builder.setView(layout);
TextView title = new TextView(this);
title.setText(R.string.about_title);
title.setGravity(Gravity.CENTER);
title.setTextSize(20);
builder.setCustomTitle(title);
builder.setPositiveButton("OK", null);
dialog = builder.create();
break;
I have created two different views for the about menu - for both horizontal and vertical viewings.
When displaying vertically, the about menu looks fine, but when displaying horizontally the bottom part of the text is being cut off. I am using the LayoutInflator and View controls without having that much knowledge about how they work, so I assume they are currently filling to some Android-specified size.
How can I create the dialog to take up the whole screen, or at least 90% of it?
Edit - My layouts looked like this:
Vertical Layout:
<ImageView
android:id="#+id/imageView1"
android:layout_width="120dp"
android:layout_height="120dp"
android:src="#drawable/icon" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="#string/game_name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/game_description"
android:textAppearance="?android:attr/textAppearanceMedium" />
Horizontal Layout:
<ImageView
android:id="#+id/imageView1"
android:layout_width="120dp"
android:layout_height="120dp"
android:src="#drawable/icon" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="#string/game_name"
android:textAppearance="?android:attr/textAppearanceMedium" />
<TextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="5dp"
android:text="#string/game_description"
android:textAppearance="?android:attr/textAppearanceMedium" />
You may call the following on your dialog to fill entire space.
dialog.getWindow().setLayout(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);

Android 3.1 Dialog not the right size

I am creating a custom dialog in my app and it looks fine in the Layout Editor, but is not the right size on the device. Here's the layout for the dialog:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:background="#drawable/dialog_border"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/image"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_centerHorizontal="true"
android:padding="10dp"
android:src="#drawable/wifi" />
<TextView
android:layout_height="wrap_content"
android:id="#+id/heading"
android:layout_below="#+id/image"
android:layout_width="wrap_content"
android:layout_margin="10dp"
android:layout_alignLeft="#+id/cancel_button"
android:layout_alignRight="#+id/continue_button"
android:gravity="center"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="#string/lost_connection"
android:layout_centerHorizontal="true" />
<TextView
android:layout_height="wrap_content"
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_below="#+id/heading"
android:textAppearance="?android:attr/textAppearanceMedium"
android:layout_centerHorizontal="true"
android:layout_alignLeft="#+id/cancel_button"
android:layout_alignRight="#+id/continue_button"
android:gravity="center"
android:layout_margin="10dp"
android:text="#string/try_again" />
<Button
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_toRightOf="#+id/cancel_button"
android:layout_below="#+id/description"
android:layout_centerHorizontal="true"
android:id="#+id/dismiss_button"
android:text="#string/dismiss" />
</RelativeLayout>
This is what it looks like in the Layout Editor:
But this is what it looks like on the device:
It has that weird bit of extra space at the top and right side and the button is compress vertically.
That blank area is the dialog title. It can be turned off when creating the DialogFragment as:
DialogFragment df = new MyDialogFragment();
df.setStyle(DialogFragment.STYLE_NO_TITLE, 0);
df.show(ft, "dialog");
Where the 0 in set style lets the platform choose an appropriate style and "dialog" is whatever tag you'd like to set for your dialog fragment.
I think that extra weird space at the top is the place for the dialog title. As i see on the screenshots you used a dialog and inflated a custom view into that dialog ?
I guess worth a try to hide the title of the dialog with yourDialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);

Categories

Resources