I'm having troubles to create a layout like that, the Dialog on left side of image. But I want to create it using horizontal orientation. I want that my layout have this appearance, but only with two buttons horizontally.
My problem is the layout xml file, I don't know how to start this layout... =(
The real problem is how to edit the xml file to the buttons get centralized, I tried a lot of thinks, padding, orientation, align etc... But I cant align that. My current layout is that. How can I centralize the buttons?
Can someone help me?
And here is my xml file code...
<?xml version="1.0" encoding="utf-8"?>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:id="#+id/textView6"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Large Text"
android:id="#+id/textView7"
/>
Can someone help me?
you can do somethnig like this :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:orientation="horizontal">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button1"
android:id="#+id/button1" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button2"
android:id="#+id/button2" />
</LinearLayout>
</RelativeLayout>
First, you need to create your desired layout with the buttons that you mentioned (I figured you can do this yourself). Then, you would use that layout to inflate an AlertDialog as I have done below:
View alertView = getLayoutInflater().inflate(
R.layout.your_custom_layout,
(ViewGroup) findViewById(R.id.alertViewLayout));
new AlertDialog.Builder(this)
.setTitle(title)
.setView(alertView)
.setPositiveButton("Yes",
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog,
int which) {
// handle click here
// dismiss AlertDialog
dialog.dismiss();
}
})
.setNegativeButton("No",
new DialogInterface.OnClickListener() {
public void onClick(DialogInterface dialog,
int which) {
// handle click here
// dismiss AlertDialog
dialog.dismiss();
}
}).show();
You could access the views in the AlertDialog's layout by referencing the parent view (alertView);
ImageButton button1 = (ImageButton) alertView.findViewById(R.id.button1);
ImageButton button2 = (ImageButton) alertView.findViewById(R.id.button2);
Edit
This is a sample layout file with 2 ImageButtons placed side-by-side.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/alertViewLayout"
android:layout_gravity="center"
android:gravity="center"
android:orientation="horizontal">
<ImageButton
android:id="#+id/button1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="left|center"
android:layout_weight=".5"
android:background="#+drawable/imageButton1"
android:text="Button 1" />
<ImageButton
android:id="#+id/button2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="right|center"
android:layout_weight=".5"
android:background="#+drawable/imageButton2"
android:text="Button 2" />
</LinearLayout>
Edit 2
Since you want your buttons to have custom backgrounds, I suggest you use an ImageButton and set the background property to your choice background.
If you want more details on how to create a layout file, you can check Android Developer documentation.
Let me know if this helps.
Could you be more clear in your question please? I don't know if I got it right but I will try to explain it.
First, if you want to create a custom layout for you dialog, you should create a .xml file and then inflate it with this specific layout.
But I think that is not your case, what you want to do it's to simply create a custom dialog, right? The screen orientation doesn't matter (I don't know if you meant it).
I don't think I should explain you the whole process or just paste the code, it's better to you to get used with android official documentation, so take a look at this link: Dialogs | Android Development
Hope it can help you.
Simplest answer:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:orientation = "horizontal">
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Large Text"
android:id="#+id/textView6"
/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Large Text"
android:id="#+id/textView7"/>
</LinearLayout>
Related
I have a DialogFragment with multi chose style, which means it does not dismiss on select/deselect. The only way to dismiss it seems to be to click on the device Back button.
Im finding it strange to have click the device back button to dismiss the dialog. Is there a way to add a Done button to the dialog, next to the title?
Its quite simple actually, I'm extending the theoretical answer here:
Create your custom layout eg as myLayoutTitle.xml:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="50dp"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/select_type_title_container"
android:background="#f6f6f6">
<TextView
android:layout_width="wrap_content"
android:layout_height="50dp"
app:layout_constraintLeft_toLeftOf="#+id/select_type_title_container"
app:layout_constraintTop_toTopOf="#+id/select_type_title_container"
android:text="#string/menu_types"
android:layout_gravity ="center_vertical"
android:gravity="center_vertical"
android:textStyle="bold"
android:textSize="20dp"
android:id="#+id/select_types_textview"/>
<Button
android:layout_width="wrap_content"
android:layout_height="40dp"
app:layout_constraintRight_toRightOf="#+id/select_type_title_container"
app:layout_constraintTop_toTopOf="#+id/select_type_title_container"
android:layout_margin="5dp"
android:text="Done"
android:textColor="#color/colorPrimary"
android:id="#+id/done_select_types"
android:layout_gravity ="center_vertical"/>
</androidx.constraintlayout.widget.ConstraintLayout>
The on your dialog builder
builder.setCustomTitle(activity?.layoutInflater?.inflate(R.layout.myLayoutTitle, null))
In Android App, I have a card game designed with the Linear layout and image buttons. On completing a level in this game I have to do the following things as listed below...
I have to show a dialog like screen which should pop up on middle of screen. This pop-up should hold some background image and buttons on it. The pop-up should fly from bottom-up.
The card game parent screen should be blurred this this pop-up is shown.
I have seen the similar kind of effects in showing ads from Appflood.
Could you please give some suggestion to this effectively.
Parent Screen
With Pop-Up
Thanks in Advance..
Try that:
Don't use AlertDialog, you can use one normal layout and one normal class. ¿How?
It's easy, you have one class called "FirstActivity.java", and one second class called "SecondActivity.java".
FirstActivity
Designed this class as you like
SecondActivity
You are going to create your own popup with ImageView,Buttons and textviews and you are going to Overlay your layout background.
Popup_layout.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ImageView
android:id="#+id/popup"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:src="#drawable/popup_background" />
<ImageView
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="39dp"
android:layout_marginTop="72dp"
android:onClick="go"
android:src="#drawable/ok" />
<TextView
android:id="#+id/question"
android:text:"level completed"
</RelativeLayout>
manifest
Declare SecondActivity with custom Theme.
......
<activity
android:name="com.example.comandero.SecondActivity"
android:label="#string/app_name"
android:theme="#style/Theme.Overlay" />
.......
Styles.xml
Add new style for background on your layout.
<style name="Theme.Overlay" parent="android:style/Theme.Translucent">
<item name="android:windowNoTitle">true</item>
<item name="android:windowContentOverlay">#null</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:background">#android:color/transparent</item>
</style>
Try it and say me please. If you dont understand something say me.
I have a very simple solution (and I tested it - it works pretty well, as illustrated by the pictures I posted).
Imagine you have an invisible (GONE) generic View that covers the whole screen (match_parent, match_parent) and has a reddish semitransparent color.
It would become VISIBLE before showing the Dialog and GONE again after dismissing it.
Since it's GONE, you don't see it and it doesn't waste any space until it becomes VISIBLE.
This approach requires the outer container being a FrameLayout or a RelativeLayout (by setting the View properly: anchoring it to the four Parent's corners).
I used a RelativeLayout - because I really love these containers.
dlg_red_bg.xml
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/black"
android:padding="8dp"
>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="#android:color/black"
android:padding="8dp"
>
<Button
android:id="#+id/btnTopLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:background="#drawable/ball"
android:text="Btn 1"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
/>
<Button
android:id="#+id/btnTopRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_toRightOf="#id/btnTopLeft"
android:background="#drawable/ball"
android:text="Btn 2"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
/>
<Button
android:id="#+id/btnBottomLeft"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/btnTopLeft"
android:layout_alignParentLeft="true"
android:background="#drawable/ball"
android:text="Btn 3"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
/>
<Button
android:id="#+id/btnBottomRight"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/btnTopRight"
android:layout_toRightOf="#id/btnBottomLeft"
android:background="#drawable/ball"
android:text="Btn 4"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
/>
<Button
android:id="#+id/btnDialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:background="#drawable/ball"
android:onClick="clickHandler"
android:text="Dialog"
android:textColor="#android:color/white"
android:textSize="24sp"
android:textStyle="bold"
/>
</RelativeLayout>
<View
android:id="#+id/vwRedOver"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:background="#8f00"
android:visibility="gone"
/>
</RelativeLayout>
code used to highlight the background
public void clickHandler(final View v)
{
switch(v.getId())
{
case R.id.btnDialog:
{
vwRedOver.setVisibility(View.VISIBLE);
final AlertDialog.Builder bld = new AlertDialog.Builder(this);
bld.setMessage("Some Message")
.setCancelable(true)
.setPositiveButton
(
"OK",
new DialogInterface.OnClickListener()
{
#Override
public final void onClick
(final DialogInterface dlg, final int id)
{
vwRedOver.setVisibility(View.GONE);
dlg.cancel();
}
}
)
.setNegativeButton
(
"Cancel",
new DialogInterface.OnClickListener()
{
#Override
public final void onClick
(final DialogInterface dlg, final int id)
{
vwRedOver.setVisibility(View.GONE);
dlg.cancel();
}
}
);
bld.create().show();
}
}
}
result
Before Clicking on "Dialog"
After Clicking on "Dialog"
NOTE 1: It's dark because of the black background
NOTE 2: You see a black border, because I set a padding on the outer RelativeLayout - you can remove it
After Clicking on either "OK" or "Cancel" - returns to the initial state (my Dialog doesn't do anything interesting on OK - It's only for demo purposes)
I have a custom dialog which has 3 buttons and sometimes it has one button only. When I have 3 buttons, the LinearLayout fits those buttons well in itself. But when I have just one button, it gives the whole width available to a single button making that button look too big. I want that, if there's only one button, it should only take half the the complete width available or should wrap content (Button image.) See following images for reference-
Refer this XML file which is similar to your requirement. Just visibility to gone to not required button.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" android:weightSum="3" android:gravity="center_horizontal">
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"/>
<Button
android:id="#+id/button2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button" />
<Button
android:id="#+id/button3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Button"/>
</LinearLayout>
In order to have one button take up half the available screen width you need to
set android:weightSum="2" in the parent LinearLayout
set android:layout_weight="1" in the Button
this is my main .xml file :
<?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"
android:padding="5dip"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#color/mbackground1"
android:gravity="center_horizontal"
android:text="#string/decode_label"
android:padding="5dip"
/>
<TextView
android:id="#+id/mytext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:background="#color/mbackground2"
android:textColor="#color/mytextcolor"
android:padding="5dip"
/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/continue_label"
android:gravity="center_horizontal"
android:textColor="#color/mytextcolor"
android:padding="5dip"
/>
<Button
android:id="#+id/webbutton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/web_button"
android:textColor="#color/mytextcolor"
/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/continue_label1"
android:gravity="center_horizontal"
android:textColor="#color/mytextcolor"
android:padding="5dip"
/>
<Button
android:id="#+id/callbutton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/call_button"
android:textColor="#color/mytextcolor"
/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/continue_label2"
android:gravity="center_horizontal"
android:textColor="#color/mytextcolor"
android:padding="5dip"
/>
<Button
android:id="#+id/emailbutton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/sendemail_button"
android:textColor="#color/mytextcolor"
/>
</LinearLayout>
i want that based on output at runtime it should show only one textview and button corresponding to that output. im defining layout in main.xml file and also i am ew in this field.
does any one have any idea.
thanks in advance
I assume you know how to get a reference to the views you defined, for example:
Button button = (Button)findViewById(R.id.emailbutton)
You will need to define an id to each and every view you want to use in the code, just like you did to the emailbutton:
android:id="#+id/emailbutton"
In order to set the visibility of a view you call:
button.setVisibility(View.GONE);
you have the option to set the visibility to INVISIBLE and VISIBLE.
Then you can play with the visibility as you like.
The differnece between INVISIBLE and GONE is that GONE removes the view completely from the layout while INVISIBLE "saves" the space this view takes.
You can see that in the API examples.
To remove yourview in java code:
Button btn=(Button)findViewById(R.id.btn);
btn.setVisibility(View.GONE);
To transparent yourview in java code:
Button btn=(Button)findViewById(R.id.btn);
btn.setVisibility(View.INVISIBLE);
To remove yourview in Xml file:
<yourView
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="gone"/>
To transparent button in Xml file:
<yourView
android:id="#+id/btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:visibility="invisible"/>
to make a view visible or invisible try this:
yourView.setVisibility(View.GONE);
yourView.setVisibility(View.VISIBLE);
Use textView.setVisibility(View.GONE); - to make View Gone and textView.setVisibility(View.INVISIBLE); - to make view INVISIBLE
The view's visibility can be changed using the View.setVisibility() method, check this link for more info. Hope this helps.
Get the View by ID and make it invisible. For your "mytext" TextView for example:
TextView my = (TextView) findViewById(R.id.mytext); // Get the view you want to manipulate
my.setVisibility(View.INVISIBLE); // Make it invisible
my.setVisibility(View.VISIBLE); // Make it visible again
Always check the documentation first!
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);