I'm developing an android application for Tablet. I have implemented a DialogFragment that look like this:
The xml layout is defined by this code:
<?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"
android:background="#F7F7F7" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentTop="true">
<EditText
android:id="#+id/destinatario_messaggio"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:inputType="text"
android:hint="Destinatario del messaggio"
android:textColor="#000000"
android:textSize="24dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_alignParentBottom="true"
android:background="#FFFFFF">
<View android:layout_width="fill_parent"
android:layout_height="1dip"
android:background="#888888" />
<EditText
android:id="#+id/body_messaggio"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="20dp"
android:inputType="textMultiLine"
android:text=""
android:hint="Scrivi Messaggio"
android:textColor="#000000"
android:textSize="24dp"
android:maxLines="5"/>
</LinearLayout>
</RelativeLayout>
I have two problem:
1- Since I'm using tablet, I want that all the spaces available on the left and on the right of my Dialog is filled from the Dialog itself. Even if I have setted in the root View this:
android:layout_width="match_parent"
my Dialog is floating at center of the Activity, letting a lot of space available on the left and on the right of it.
How can my Dialog occupy all the width available in my device?
2- When the keyboard(IME) appears for editing the EditText field my Dialog is thrust upon hiding the top of the Dialog (the Title and the first TextView become invisible). Instead what I want is that the top of the Dialog remains on top and the center of the Dialogis "compressd". It seems like my layout does not adapt itself to the new available space.
For your first part to make the dialog fill in width use.
dialog.getWindow().getAttributes().width = LayoutParams.FILL_PARENT;
Related
I am trying to create a screen where you have a ScrollView on top and under that you have a TextView and a Button.
The ScrollView contains a TableLayout which it self contains TextView's, Button's and EditText's.
What I would like to achieve is that when a EditText is focues and the input panel opens on the phone, the buttom footer would be moved on top of the panel and the scroll area resized smaller, so that you can click the calculate button at any moment.
Here is my current xml:
The activity:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="#layout/activity_germinative_scroll"/>
<TextView
android:id="#+id/textViewCalculationResult"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".70"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:gravity="center"
android:text="0.00 KG/HA"
android:textSize="35sp"/>
<Button
android:id="#+id/calculateGerminative"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".30"
android:text="#string/calculate_germinative"
android:textSize="25sp"
android:textAllCaps="true"
android:layout_marginRight="10dp"
android:layout_marginLeft="10dp"
android:layout_marginBottom="10dp"
android:background="#drawable/menu_button_states"
android:nextFocusDown="#id/editSeedMass"/>
</LinearLayout>
Scroll activity:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:fillViewport="true"
android:orientation="vertical"
android:showDividers="beginning|end"
>
<TableLayout
android:id="#+id/tableLayout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:clickable="true"
android:focusable="true"
android:focusableInTouchMode="true"
android:padding="10dip"
>
<TableRow
android:layout_height="wrap_content"
android:layout_width="wrap_content">
<TextView
android:id="#+id/teraMass"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight=".40"
android:textSize="20sp"
android:editable="false"
android:text="#string/seed_mass_text"
android:textAllCaps="true"/>
<Space
android:layout_width="13dp"/>
<Button
android:id="#+id/seedMassInfo"
android:tag="seedMassInfo"
android:layout_width="30dp"
android:layout_height="30dp"
android:background="#drawable/info"/>
</TableRow>
<Space
android:layout_height="3dp"/>
... Many other TableRow's with the exact same layout...
</TableLayout>
</ScrollView>
So what happens right now is that when I focus on one of the input fields in my scroll area, the button at the bottom gets resized into a very thin little button and depending of the screen size, the text-field in the footer will get resized also.
I use this setting for the activity in the manifest:
android:windowSoftInputMode="stateHidden|adjustResize">
Is the problem because of the overall layout I use or what?
You should set fixed height for the Button calculateGerminative and TextView textViewCalculationResult, and set the scrollview height to dynamic, i.e.
android:layout_height="0dp"
android:layout_weight="1"
I am coding in XML on android studios, and I am having trouble getting the EditText to be centered at the top and the Button to be centered in the center. I do not know a lot about code so the other things I've read about Relative vs Linear Layout have been very confusing. I've never coded prior to this, so I'm very sorry if most of it is wrong.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:id="#+id/touch" >
<EditText android:id="#+id/edit_message"
android:layout_width="225dp"
android:layout_height="225dp"
android:layout_gravity="center"
android:hint="#string/edit_message"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="top"
android:textSize="62sp"
android:text="#string/begin_app"/>
</LinearLayout>
Use the below code in your layout:
android:layout_alignParentTop will align the view on Top
android:layout_alignParentTop will align the view on center of parent
android:layout_centerHorizontal="true" and android:layout_centerVertical="true" will align the view in center of the parent
Layout code with RelativeLayout
<?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">
<EditText
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:text="text" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Button" />
</RelativeLayout>
In android studio just go to the layout xml file and click Design, you can drag and drop the widgets wherever you want and the system will generate the code for you with the placement you desired. Its great for starters.
I have a specific question concerning the use of the MaterialSpinner view.
I want the spinner to be perfectly aligned to the right of an EditText wrapped in a android.support.design.widget.TextInputLayout view group for floating label support.
I've tried both LinearLayout and RelativeLayout (using the align to layout attributes) and none are working properly.
I end up with something looking like this.
Below is my layout so far:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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_height="match_parent"
android:orientation="vertical">
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<android.support.design.widget.TextInputLayout
android:id="#+id/weightWidget"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1">
<EditText
android:id="#+id/weight"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:ems="10"
android:hint="#string/weight"
android:inputType="number" />
</android.support.design.widget.TextInputLayout>
<fr.ganfra.materialspinner.MaterialSpinner
android:id="#+id/spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:entries="#array/weights_unit_array"
app:ms_alignLabels="false"
app:ms_arrowColor="#0000FF"
app:ms_arrowSize="16dp"
app:ms_floatingLabelColor="#00FF00"
app:ms_floatingLabelText="floating label"
app:ms_hint="#string/unit"
app:ms_multiline="false"
app:spinnerMode="dialog" />
</LinearLayout>
</LinearLayout>
In the preview of the layout designer in Android Studio, it seems that it's aligned but when I run it either on the emulator or a real device, the views are not aligned as shown in the previous screenshot.
I decided not to use the MaterialSpinner view although it looks good with the floating label.
I'm using a regular Spinner with the .underline style applied:
<Spinner
android:id="#+id/height_unit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:entries="#array/heights_unit_array"
android:prompt="#string/unit"
android:spinnerMode="dialog"
style="#style/Widget.AppCompat.Spinner.Underlined"
android:layout_gravity="bottom"/>
I want something like this:
But I don't know how to resize the TextView so it gets all the available space on screen which is not ocuppied by the EditText or the Buttons. May I do it in the code, or in the xml?
At XML I tried putting the TextView into a FrameLayout, but it makes no difference. Currently looks like:
<?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">
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/consola"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:scrollbars = "vertical"
android:text="#string/hello"/>
</FrameLayout>
<EditText
android:id="#+id/comando"
android:layout_width="fill_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content">
<Button
android:text="Conectar"
android:id="#+id/boton_conectar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
<Button
android:text="Enviar"
android:id="#+id/boton_enviar"
android:layout_width="wrap_content"
android:layout_weight="0.5"
android:layout_height="wrap_content">
</Button>
</LinearLayout>
</LinearLayout>
At the code I'm just checking if the Buttons are pushed with Listeners. One of them, when pushed, gets the text at the EditText, and appends it to the TextView. It works, and TextView gets higher, while EditText and Buttons downs one line. If I go on appending lines, finaly EditText and Buttons get out of the screen. I want to avoid this behaviour, and accomplish to get this 3 widgets sticked to the bottom of the screen.
Use the android:layout_weight=1 attribute, like the buttons on the bottom of the form. That will assign most of the space to it and anything that's left to the rest of the elements.
It's all about the weight. This should give you what you want:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView android:text="TextView"
android:id="#+id/textView1"
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="0dp">
</TextView>
<EditText android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<requestFocus></requestFocus>
</EditText>
<LinearLayout android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button android:text="Button"
android:id="#+id/button1"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_width="0dp">
</Button>
<Button android:text="Button"
android:id="#+id/button2"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:layout_weight="1">
</Button>
</LinearLayout>
</LinearLayout>
(Side note: When using weight, setting the corresponding height/width to 0dp sometimes gets around some weird behavior.)
Try android:fillViewport="true".
I have the following code in my layout.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">
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal" android:layout_height="wrap_content" android:layout_width="fill_parent">
<EditText android:hint="#string/feed_url"
android:id="#+id/feedUrl" android:textSize="14dp" android:inputType="textUri"
android:layout_marginRight="45dp" android:layout_height="wrap_content" android:layout_width="fill_parent">
</EditText>
<Button android:id="#+id/getGraph"
android:text="#string/get"
android:layout_toRightOf="#id/feedUrl"
android:layout_alignParentRight="true"
android:layout_height="wrap_content" android:width="45dp" android:layout_width="wrap_content">
</Button>
</RelativeLayout>
<WebView android:id="#+id/wv1" android:layout_height="wrap_content"
android:layout_width="fill_parent" />
</LinearLayout>
In the eclipse Plugin layout creator, the EditText and button are shown properly. (see the below screenshot)
But on the device and emulator, the button is not hidden. (see the below screenshot)
Any idea why the button is getting hidden in the device?
Try the following changes to your code. You have to define the button first, since it is of fixed width, and then place the EditText to fill the rest of the space, placed to the left of the button. The button also has to be defined first (prior to Android 2.2, that is).
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="wrap_content"
android:layout_width="fill_parent">
<Button
android:id="#+id/getGraph"
android:text="#string/get"
android:layout_alignParentRight="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
<EditText
android:hint="#string/feed_url"
android:id="#+id/feedUrl"
android:textSize="14dp"
android:inputType="textUri"
android:layout_marginRight="45dp"
android:layout_height="wrap_content"
android:layout_width="fill_parent"
android:layout_toLeftOf="#id/getGraph"
/>
</RelativeLayout>
I cannot see the button in the layout builder... the reason, I think is that the EditText width is fill parent so it fills parent pushing the button out. If you must use RelativeLayout, you need to define width of the EditText explicitly. Otherwise you may want to switch to horizontal LinearLayout and set weight of the edit box to "1".
Also, there are invalid options for RelativeLayout:
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal
You can also use LinearLayout instead of RelativeLayout to archive this. You can use android:layout_weight to make Button not be overlaid by EditText. Following is the sample xml that may work:
<LinearLayout android:orientation="horizontal"
android:layout_height="wrap_content" android:layout_width="fill_parent">
<EditText android:hint="#string/feed_url"
android:id="#+id/feedUrl" android:textSize="14dp"
android:inputType="textUri" android:layout_marginRight="45dp"
android:layout_height="wrap_content" android:layout_width="fill_parent" />
<Button android:id="#+id/getGraph" android:text="#string/get"
android:layout_height="wrap_content" android:width="45dp"
android:layout_width="wrap_content"
android:layout_weight="1" />
</LinearLayout>