Using LayoutInflator to create a dialog that takes up whole screen - android

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);

Related

ScrollView in Dialog anchors to wrong place

I have an alertdialog with a custom layout, including a scrollview.
When the dialog appears, the scrollview is "cropped", and appears to be anchored to the top of the Screen, rather than the top of the dialog
I have searched SE for similar problems, and cannot find any.
Using a popup Window has exactly the same issue.
Here is my XML:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scroller"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/rock">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:padding="10dp">
<TextView
android:id="#+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:background="#drawable/scrollbutton"
android:padding="12dp"
android:text="Room Number"
android:textColor="#android:color/black"
android:textSize="22sp" />
<TextView
android:id="#+id/contents"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/scrollbutton"
android:gravity="center"
android:padding="12dp"
android:text="Here be Monsters" />
</LinearLayout>
</ScrollView>
And here is the dialog code:
LayoutInflater inflater = (LayoutInflater) this.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View layout = inflater.inflate(R.layout.contents, null);
AlertDialog.Builder alertDialog = new AlertDialog.Builder(this);
alertDialog.setView(layout);
AlertDialog alert = alertDialog.create();
alert.requestWindowFeature(Window.FEATURE_NO_TITLE);
alert.show();
Window window = alert.getWindow();
window.setLayout((int)(screenWidth*.8), (int)(screenHeight*.8));
I have tried adding the ScrollView as the root_view in the inflater, and also adding a LinearLayout around the ScrollView and setting this as root_view, but this does not alter the results
You don't set parent to layout inflater. Let dialog manages view arranging DialogFragment

How to show custom dialog at Center Vertical

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

Android- adding view to layout causing layout to be in front of ActionBar

I have a view in which I'm creating a PopupWindow. In this PopupWindow, I have a text box (EditText). When clicking to edit the text, the keyboard opens and the whole view goes up, but the top of the view goes under the action bar view smoothly. So far so good.
I now have added an empty GridView without any further configuration to the PopupWindow, and now the same scenario happens but the whole top part of the view goes on top of the action bar view and not smooth (the popup becomes a mess, when keyboard disappears the popup location changes for couple of seconds and there are "leftovers" from the keyboard for a second). It also happens with ListView.
I want the top part of the view to go under the 'ActionBar` smoothly, as it should.
Any ideas?
UPDATE: By adding the GridView programatically I partially solved it on a couple of devices, but on some devices it's still happens.
Displaying the popupwindow:
pView=inflater.inflate(R.layout.activity_packbuild, (ViewGroup)mainActivity.findViewById(R.layout.activity_main));
pw = new PopupWindow(
pView,
ma.f.getView().getMeasuredWidth(),
ma.f.getView().getMeasuredHeight(),
true);
pw.showAtLocation(mainActivity.getWindow().getDecorView().findViewById(android.R.id.content), Gravity.BOTTOM, 0, 0);
GOOD:
BAD:
Layout:
<?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:id="#+id/lID">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/rID"
android:background="#drawable/back5">
<ImageView
android:layout_width="125px"
android:layout_height="200px"
android:id="#+id/mImageView"
android:background="#drawable/com_facebook_picker_default_separator_color"
android:layout_alignParentTop="true"
android:layout_weight="1"
android:layout_centerHorizontal="true"
android:layout_marginTop="300dp" />
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:layout_below="#+id/mImageView"
android:layout_marginTop="22dp"
android:layout_toRightOf="#+id/lButton"
android:layout_toLeftOf="#+id/rButton" />
<ImageView
android:layout_width="125px"
android:layout_height="200px"
android:id="#+id/imageViewRR"
android:background="#drawable/com_facebook_picker_default_separator_color"
android:layout_alignTop="#+id/mImageView"
android:layout_toRightOf="#+id/mImageView"
android:layout_marginLeft="20dp" />
<ImageView
android:layout_width="125px"
android:layout_height="200px"
android:id="#+id/imageViewLL"
android:background="#drawable/com_facebook_picker_default_separator_color"
android:layout_alignTop="#+id/mImageView"
android:layout_toLeftOf="#+id/mImageView"
android:layout_marginRight="20dp" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/lButton"
android:layout_below="#+id/editText"
android:layout_alignLeft="#+id/imageViewLL"
android:layout_alignStart="#+id/imageViewLL" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/rButton"
android:layout_alignTop="#+id/lButton"
android:layout_alignRight="#+id/imageViewRR"
android:layout_alignEnd="#+id/imageViewRR"
android:layout_marginTop="5dp" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/picButton"
android:layout_alignTop="#+id/galleryButton"
android:layout_alignLeft="#+id/editText"
android:layout_alignStart="#+id/editText"
android:background="#drawable/camera2" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/videoButton"
android:background="#drawable/video"
android:layout_alignTop="#+id/galleryButton"
android:layout_centerHorizontal="true" />
<ImageView
android:layout_width="125px"
android:layout_height="200px"
android:id="#+id/imageViewR"
android:background="#drawable/com_facebook_picker_default_separator_color"
android:layout_above="#+id/editText"
android:layout_alignRight="#+id/sendButon"
android:layout_alignEnd="#+id/sendButon" />
<ImageView
android:layout_width="125px"
android:layout_height="200px"
android:id="#+id/imageViewL"
android:background="#drawable/com_facebook_picker_default_separator_color"
android:layout_alignTop="#+id/mImageView"
android:layout_alignLeft="#+id/editText" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/galleryButton"
android:background="#drawable/gallery"
android:layout_alignTop="#+id/rButton"
android:layout_alignRight="#+id/imageViewR" />
<ImageButton
android:layout_width="100px"
android:layout_height="100px"
android:id="#+id/toButton"
android:layout_above="#+id/imageViewR"
android:layout_alignLeft="#+id/picButton"
android:layout_alignStart="#+id/imageViewL"
android:background="#drawable/fbfriends2"
android:layout_alignRight="#+id/imageViewLL"
android:layout_alignEnd="#+id/imageViewLL"
android:layout_marginBottom="20dp" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/sendButon"
android:background="#drawable/go"
android:layout_alignTop="#+id/toButton"
android:layout_alignRight="#+id/editText"
android:layout_alignEnd="#+id/editText" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/plusButtonL"
android:background="#drawable/plusp"
android:layout_alignTop="#+id/videoButton"
android:layout_toRightOf="#+id/imageViewLL" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/minusButtonR"
android:background="#drawable/minusp"
android:layout_alignTop="#+id/videoButton"
android:layout_toLeftOf="#+id/imageViewRR" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/plusButton"
android:background="#drawable/plusp"
android:layout_alignTop="#+id/videoButton"
android:layout_centerHorizontal="true" />
<ImageButton
android:layout_width="40dp"
android:layout_height="40dp"
android:id="#+id/minusButton"
android:background="#drawable/minusp"
android:layout_alignTop="#+id/videoButton"
android:layout_centerHorizontal="true"
android:layout_marginTop="300dp" />
</RelativeLayout>
I'm adding the GridView programmatically:
gv=new GridView(ma);
List<Student> hhh=new ArrayList<Student>();
if (FriendPickerApplication.selectedUsers!=null) {
if (FriendPickerApplication.selectedUsers.size() > 0) {
for (GraphUser gu : FriendPickerApplication.selectedUsers) {
hhh.add(new Student("name", gu.getId()));
}
}
}
StudentAdapter sta=new StudentAdapter(ma,hhh);
//gv=(GridView)pView.findViewById(R.id.gridView2);
gv.setVisibility(View.VISIBLE);
MainActivity.wantedPicSize=ma.screenWidth/12; //6
int wantedSize=MainActivity.wantedPicSize+2; //10
RelativeLayout.LayoutParams relativeParams = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.MATCH_PARENT,
RelativeLayout.LayoutParams.MATCH_PARENT);
relativeParams.addRule(RelativeLayout.LEFT_OF, btnSend.getId());
relativeParams.addRule(RelativeLayout.RIGHT_OF,picFriends.getId());
relativeParams.addRule(RelativeLayout.ALIGN_TOP, picFriends.getId());
relativeParams.addRule(RelativeLayout.ALIGN_BOTTOM, picFriends.getId());
gv.setLayoutParams(relativeParams);
gv.setPadding(5,0,5,0);
((RelativeLayout)pView.findViewById(R.id.rID)).addView(gv);
ViewGroup.LayoutParams layoutParams = new RelativeLayout.LayoutParams(
RelativeLayout.LayoutParams.FILL_PARENT,
RelativeLayout.LayoutParams.FILL_PARENT);//gv.getLayoutParams();
relativeParams.height = wantedSize+(int)(wantedSize/5); //this is in pixels
relativeParams.width = (int)(ma.screenWidth/3.0);//gv.getLayoutParams().width; //(int)( ( ((ma.screenWidth*3)/4)/wantedSize )*wantedSize );
gv.setColumnWidth(wantedSize); //+width betwen profiles
gv.setVerticalSpacing(5);
//gv.setNumColumns((int)((screenWidth/2)/100));
gv.setNumColumns((relativeParams.width/wantedSize));
System.out.print("COLUMNSSSSSSSSSS- "+(relativeParams.width/wantedSize));
gv.setLayoutParams(relativeParams);
gv.setVisibility(View.VISIBLE);
gv.setAdapter(sta);
Your problem here is the popup window.
There is no way to make it go under the actionbar since the actionbar is displayed in another window that is below the new window you are creating. moreover using a popup window for that complex layout is never going to perform efficiently. Have you thought of wrapping your map and the layout you are putting in the popup window in a custom layout? That would probably be the easier solution
I agree with the answer posted by Pasquale Anatriello. Though u can
You can try different methods :
mPopUpWindow.showAsDropDown(anchor);
mPopUpWindow.showAsDropDown(anchor, xoff, yoff);
mPopUpWindow.showAtLocation(parent, gravity, x, y);
I suggest you should let popUp draw only after Action Bar, take y axis offset and gravity top, say: yOffset is Equivalent to actionbar height, if you have action bar ~ height x 10% of device height , [layout_weight = 1.0].
Even if it didn't work out create a custom View [say Linear Layout] that appears and disappears and acts like popup a window and give u flexibility as u want,handle clicks by yourself, make it like a toggle, see code for animation::
Animation fadeInAnimation = AnimationUtils.loadAnimation(v.getContext(), android.R.anim.fade_in);
fadeInAnimation.setDuration(10);
v.startAnimation(fadeInAnimation);
Animation fadeOutAnimation = AnimationUtils.loadAnimation(v.getContext(), android.R.anim.fade_out);
fadeOutAnimation.setDuration(10);
v.startAnimation(fadeOutAnimation);

TextView in customtitle view of alert dialog is not displayed

I make setting customtitle of alertdialog builder with a view that contains two webviews for animated gif and textview between them. the webviews are shown in the title of the alert dialog but the textview is missing.
here the view XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="75dp"
android:weightSum="1"
android:background="#android:color/background_dark">
<WebView
android:layout_width="wrap_content"
android:layout_height="75dp"
android:id="#+id/Title_webView1"
android:layout_weight="0.15"
android:layout_gravity="left" />
<TextView
android:id="#+id/titletextView"
android:layout_width="match_parent"
android:layout_height="75dp"
android:textAppearance="?android:attr/textAppearanceLarge"
android:layout_gravity="center"
android:layout_weight="0.7"
android:textAlignment="center"
android:textIsSelectable="false"
android:visibility="visible"
android:gravity="center_vertical|center_horizontal"
android:inputType="none"
android:textColor="#d0d2d116"
android:text="test123"
android:singleLine="true"
android:textSize="32dp" />
<WebView
android:layout_width="wrap_content"
android:layout_height="75dp"
android:id="#+id/Title_webView2"
android:layout_weight="0.15"
android:layout_gravity="right" />
here the view function:
private View setCustomDialogTitle(String Title)
{
LayoutInflater inflater = getLayoutInflater();
View view = inflater.inflate(R.layout.embark_title, null);
TextView TitleText = (TextView) view.findViewById(R.id.titletextView);
TitleText.setText(Title);
WebView flashingLight1 = (WebView) view.findViewById(R.id.Title_webView1);
flashingLight1.loadUrl("file:///android_asset/flashlight751.gif");
WebView flashingLight2 = (WebView) view.findViewById(R.id.Title_webView2);
flashingLight2.loadUrl("file:///android_asset/flashlight752.gif");
return view;
}
and the function call:
AlertDialog.Builder alrtBuilder= new AlertDialog.Builder(this);
alrtBuilder.setCustomTitle(setCustomDialogTitle("Test123"));
the issue is with setting layout_width for the components and again setting them with weight.
so a small change in xml can help you out.The confusion in rendering will be the cause.
set all the layout_width attribute to "0dp"
android:layout_width="0dp"
for the three components, then it will bring you the exact look as you want. for some reference read this article, it really helps you to understand.
NB: tested and worked for your code

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