I want to design login page which is similar to facebook login page.
I have tried the below layout view ,if i change the orientation of my screen there is no space at bottom and also fields those i have taken completely changed.Please advice how to fix this problem?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/RelativeLayout1"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<ScrollView
android:id="#+id/ScrollView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true" >
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:background="#7CACF5"
android:orientation="vertical"
android:padding="10dp"
android:paddingBottom="30dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="70dp"
android:layout_marginTop="50dp"
android:gravity="center"
android:paddingBottom="5dp"
android:text="Welcome"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="email or phone"
android:inputType="textEmailAddress"
android:paddingBottom="5dp" />
<EditText
android:id="#+id/editText2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:ems="10"
android:hint="password"
android:inputType="numberPassword"
android:paddingBottom="5dp" >
<requestFocus />
</EditText>
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Log In" />
</LinearLayout>
</ScrollView>
</RelativeLayout>
Try this
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical|center_horizontal"
android:orientation="vertical"
android:padding="10dp"
android:paddingBottom="30dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_weight="1"
android:layout_marginTop="50dp"
android:gravity="center"
android:paddingBottom="5dp"
android:text="Welcome"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:hint="email or phone"
android:inputType="textEmailAddress"
android:paddingBottom="5dp" />
<EditText
android:id="#+id/editText2"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:ems="10"
android:hint="password"
android:inputType="numberPassword"
android:paddingBottom="5dp" >
<requestFocus />
</EditText>
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:text="Log In" />
</LinearLayout>
For this you need to create responsive layout, you must need to go through android development blog, who teaches us how to create responsive layout. In basic you need to implement different Drawables folders like Darawable-mdpi, Drawable-hdpi, Drawable-xhdpi, Drawable-xxhdpi and like wise, and you need to put your images in all the folders with same name, but with different sizes. Likewise, you need to create layout files as well but your xml must be designed with proper attributes as per your requirements.
Follow this Link
The layouts in /res/layout are applied to both portrait and landscape, unless you specify otherwise. Let’s assume you have /res/layout/login.xml and you want it to look differently in the 2 layout types.
Create folder /res/layout-land (here you will keep your landscape adjusted layouts).
Copy login.xml there make necessary changes to it. Run the application in the emulator and test it using the Ctrl + F11 combination
// Try this way,hope this will help you to solve your problem...
<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:background="#7CACF5"
android:gravity="center" >
<ScrollView
android:id="#+id/ScrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="10dp" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:gravity="center"
android:text="Welcome"
android:textAppearance="?android:attr/textAppearanceLarge" />
<EditText
android:id="#+id/editText1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:hint="email or phone"
android:inputType="textEmailAddress" />
<EditText
android:id="#+id/editText2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:ems="10"
android:hint="password"
android:inputType="numberPassword" >
</EditText>
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Log In" />
</LinearLayout>
</ScrollView>
</LinearLayout>
Related
I still dont understand how to use layouts when I'm trying to program for multiple screen sizes. I need to insert an image saying "Facebook" with a distance to the top and the textboxes a bit down.
But if I use margins it will mess up my layout on bigger screen sizes.
Can someone explain to me the layout of this picture:
You can solve this by creating layouts for different screen sizes.for that create separate layout folders for different screens and put corresponding layout there.For example
layout-sw720dp for 720dp devices /
layout-sw600dp for 600dp devices
change the dp value according to your need.
you can also make images for different sizes
OR
you can try this layout
<LinearLayout 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="match_parent"
android:background="#color/amna2"
android:gravity="center_horizontal"
android:orientation="vertical"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.codeslayers.amnalocations.LoginActivity">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:srcCompat="#drawable/amna" />
<LinearLayout
android:id="#+id/email_login_form"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="150dp">
<EditText
android:id="#+id/id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Van Name"
android:inputType="textEmailAddress"
android:maxLines="1"
android:singleLine="true"
android:textColor="#color/amna3"
android:textColorHint="#color/amna3"
android:textColorLink="#color/amna3" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Name"
android:maxLines="1"
android:singleLine="true"
android:textColor="#color/amna3"
android:textColorHint="#color/amna3"
android:textColorLink="#color/amna3" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/district"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Destination"
android:maxLines="1"
android:singleLine="true"
android:textColor="#color/amna3"
android:textColorHint="#color/amna3"
android:textColorLink="#color/amna3" />
</android.support.design.widget.TextInputLayout>
<android.support.design.widget.TextInputLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:id="#+id/dbname"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Database Name"
android:maxLines="1"
android:singleLine="true"
android:textColor="#color/amna3"
android:textColorHint="#color/amna3"
android:textColorLink="#color/amna3" />
</android.support.design.widget.TextInputLayout>
<Button
android:id="#+id/email_sign_in_button"
style="?android:attr/buttonBarButtonStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="#string/action_sign_in"
android:textColor="#color/amna4" />/
android:textStyle="bold" />
</LinearLayout>
You can also do some thing like this with different dimen.xml (values-sw600dp,values-sw720dp) . So you dont have to duplicate the layout files.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:textSize="32dp"
android:layout_above="#+id/inputFields"
android:id="#+id/facebook_logo"
android:gravity="center"
android:text="Facebook"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<LinearLayout
android:layout_marginTop="45dp"
android:layout_centerInParent="true"
android:id="#+id/inputFields"
android:gravity="center"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<Button
android:text="Login"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<TextView
android:gravity="center"
android:text="Forgot password ?"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</LinearLayout>
<TextView
android:id="#+id/signupTxt"
android:layout_marginBottom="10dp"
android:layout_alignParentBottom="true"
android:text="Signup for Facebook"
android:layout_centerHorizontal="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<ImageView
android:layout_alignParentBottom="true"
android:layout_marginBottom="10dp"
android:layout_alignParentRight="true"
android:src="#drawable/rotate_refresh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
I am trying to make the edittext's scroll in case the view doesn't them all. The user should be able to scroll the edittexts when keyboard is on or off.
I have tried multiple combinations of linearLayout and ScrollView but it doesn't seem to be working.
Can someone please check what is wrong with it?
<?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" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#FFFFFF"
android:orientation="vertical" >
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_marginTop="50dp"
android:text="Details"
android:textColor="#EB8024"
android:textSize="30sp" />
<EditText
android:id="#+id/name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:background="#drawable/theme_textfield_activated_holo_light"
android:ems="10"
android:hint="URI"
android:inputType="text" />
<EditText
android:id="#+id/ip_addr"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:background="#drawable/theme_textfield_activated_holo_light"
android:ems="10"
android:hint="IP Address"
android:inputType="text" />
<EditText
android:id="#+id/port"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:background="#drawable/theme_textfield_activated_holo_light"
android:ems="10"
android:hint="Port"
android:inputType="text" />
<EditText
android:id="#+id/app_name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:background="#drawable/theme_textfield_activated_holo_light"
android:ems="10"
android:hint="Application Name"
android:inputType="text" />
<EditText
android:id="#+id/string"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="30dp"
android:background="#drawable/theme_textfield_activated_holo_light"
android:ems="10"
android:hint="Nick Names"
android:inputType="text" />
<Button
android:id="#+id/submit"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical|center_horizontal"
android:layout_marginTop="20dp"
android:background="#drawable/theme_btn_default_disabled_focused_holo_light"
android:onClick="onClickNext"
android:text="Next"
android:textColor="#EB8024"
android:textSize="30sp" />
</LinearLayout>
</ScrollView>
Make your ScrollView fill the viewport and match parent's height instead of wrapping content.
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
Here is my xml code i want to apply scrolling in View but no scroll appears in my device screen.Here is the XML Layout.Can someone please suggest me possible solutions to overcome on this situation.....
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/home_bg"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<ImageView
android:id="#+id/askfatwa_header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/askfatwa_top_bar" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#id/askfatwa_header"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:orientation="vertical" >
<TextView
android:id="#+id/name_askscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/name"
android:textColor="#android:color/white"
android:textSize="20sp" />
<EditText
android:id="#+id/askscreen_name"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:paddingLeft="5dp"
android:maxLines="1"
android:inputType="text"
android:background="#drawable/textfield" >
</EditText>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:orientation="vertical" >
<TextView
android:id="#+id/email_askscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Email"
android:textColor="#android:color/white"
android:textSize="20sp" />
<EditText
android:id="#+id/askscreen_email"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:maxLines="1"
android:inputType="textEmailAddress"
android:background="#drawable/textfield"
android:paddingLeft="5dp" />
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:orientation="vertical" >
<TextView
android:id="#+id/address_askscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Address"
android:textColor="#android:color/white"
android:textSize="20sp" />
<EditText
android:id="#+id/askscreen_address"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:paddingLeft="5dp"
android:inputType="textMultiLine"
android:background="#drawable/textfield" />
</LinearLayout>
<!-- <LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:orientation="vertical" >
<TextView
android:id="#+id/contact_askscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Contact"
android:textColor="#android:color/white"
android:textSize="20sp" />
<EditText
android:id="#+id/askscreen_contact"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:paddingLeft="5dp"
android:background="#drawable/textfield" />
</LinearLayout> -->
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:orientation="vertical" >
<TextView
android:id="#+id/subject_askscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/Subject"
android:textColor="#android:color/white"
android:textSize="20sp" />
<!-- <EditText
android:id="#+id/askscreen_subject"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:paddingLeft="5dp" /> -->
<Spinner
android:id="#+id/askscreen_subject"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:paddingLeft="5dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="15dp"
android:layout_marginRight="15dp"
android:layout_marginTop="5dp"
android:orientation="vertical" >
<!-- <TextView
android:id="#+id/body_askscreen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:hint="Type Your Question"
android:textColor="#android:color/white"
android:textSize="20sp" /> -->
<EditText
android:id="#+id/askscreen_question"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="3dp"
android:background="#drawable/textfield"
android:hint="Type Your Question"
android:minLines="1"
android:inputType="textMultiLine"
android:minHeight="8dp"
android:minWidth="10dp"
android:lines="15"
android:paddingLeft="5dp" />
</LinearLayout>
<ImageView
android:id="#+id/askscreen_submit_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="10dp"
android:paddingTop="20dp"
android:src="#drawable/askftwa_submit_button" />
</LinearLayout>
</ScrollView>
Add more elements and the scroll will appear. Right now all the elements are fitting within the screen and that's why you don't see any scroll
First a fall by seeing your xml, you are creating very expensive layout containing
unnecessarily many Linear layouts ie when orientation of your all views are vertical.
Why are you defining your views like textbox and edittext in separate Linear Layouts,
it creates performance issues.
Secondly, you should not define set any background and orientation in scroll view.
By default orientation of scroll view is vertical.
Although i just run your code with few changes and its working fine on my emulator
and on my device.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent" >
// This is Main layout which contains all your child view
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/home_bg"
android:orientation="vertical" >
// Define your remaining child views here.....
// And as i can see all views are oriented vertically, so you can define all view
inside this Main Layout itself.
// Accordingly you can set Margins of your views too.
</LinearLayout>
</ScrollView>
My Activity_main.xml looks like this
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TableLayout
android:layout_marginTop="40dip"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center">
<TableRow>
<EditText
android:id="#+id/UsernameText"
android:width="250dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dip"
android:hint="#string/UsernameText"/>
</TableRow>
<TableRow>
<EditText
android:id="#+id/PasswordText"
android:width="250dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dip"
android:hint="#string/PasswordText"
android:inputType="textPassword" />
</TableRow>
</TableLayout>
<LinearLayout
android:layout_marginTop="50dip"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3"
android:gravity="center">
<Button
android:id="#+id/MyButton"
android:layout_width="0dip"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/button" />
</LinearLayout>
</LinearLayout>
Linear View :
Horizontal View:
How do I make the Button size smaller? Also how do I make both views approximately similar?
It is always advisable to have different layouts to support both orientation. Have two different xml layout files under the resource folder layout-port and layout-land. You can read this page for better understanding on how its done. Multiple screens support
// try this
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:gravity="center"
android:layout_marginLeft="40dp"
android:layout_marginRight="40dp"
android:layout_height="match_parent">
<EditText
android:id="#+id/UsernameText"
android:width="250dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dip"
android:hint="#string/UsernameText"/>
<EditText
android:id="#+id/PasswordText"
android:width="250dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="10dip"
android:layout_marginTop="5dp"
android:hint="#string/PasswordText"
android:inputType="textPassword" />
<Button
android:id="#+id/MyButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:text="#string/button" />
</LinearLayout>
I am having a heck of time trying to get my UI to look the way I want. Here's what I've got ...
I would like the TextView, the XX:XX:XX, text font to be larger and centered between the EditText and Button. Also how come the user gets the phone keyboard instead of a qwerty keyboard to use to enter text?
Here's my layout XML:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.5"
android:ems="10"
android:inputType="text" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.3"
android:text="#string/xx_xx_xx" />
<Button
android:id="#+id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="0.2"
android:text="#string/add"/>
</LinearLayout>
<ListView
android:id="#+id/bookmark_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
Use the following code to achieve what you want:......
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:ems="10"
android:inputType="text" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textSize="18dp"
android:layout_weight="1"
android:text="#string/xx_xx_xx" />
<Button
android:id="#+id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="#string/add"/>
</LinearLayout>
<ListView
android:id="#+id/bookmark_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
please refer this xml all the changes is done tested is also done.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:ems="10"
android:inputType="number" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:gravity="center_horizontal|center_vertical"
android:textSize="18dp"
android:layout_weight="1"
android:text="hello" />
<Button
android:id="#+id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_weight="1"
android:text="add"/>
</LinearLayout>
<ListView
android:id="#+id/bookmark_list"
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
</LinearLayout>
You can use relative layout to do that. You can change the font size with android:textSize
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:id="#+id/new_bookmark_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:ems="10"
android:inputType="text" />
<TextView
android:id="#+id/new_bookmark_clock"
android:layout_width="wrap_content"
android:layout_toRightOf="#id/new_bookmark_name"
android:layout_toLeftOf="#+id/btn_add_new_bookmark"
android:layout_height="wrap_content"
android:textSize="20sp"
android:text="#string/xx_xx_xx" />
<Button
android:id="#id/btn_add_new_bookmark"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="#string/add"/>
</RelativeLayout>
Replace android:layout_gravity="center" by
android:gravity="center" in your TextView.
and regarding the keyboard layout, it looks like you are trying in the emulator. The emulator shows up 12pad keyboard in portrait mode. You can try in the device.
Please follow below, i have made a sample UI exactly what you have asked for using Relative Layout and by using minimum number of lines. Please have a look and check if can solve the purpose. I have also attached snapshot for the same.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RelativeLayout
android:padding="4dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<EditText
android:id="#+id/ed_name"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:inputType="number" />
<TextView
android:id="#+id/tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_toRightOf="#+id/ed_name"
android:text="XX:XX:XX"
android:textSize="18dp" />
<Button
android:id="#+id/btn_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text=" add " />
</RelativeLayout>
</RelativeLayout>
About the keypad :Check it on actual device , the device will open its own default keypad.