Develop Reference

why the button is not display and text view?

I am new to android development . I've made a simple demo of login screen. I used Xml to do this and have checked my output on landscape and portrait mode. It looks fine in portrait mode, but on landscape my login button is not visible and I am not able to scroll my view. I used dp in my xml file and I think it is due to dp that I have this problem.
Here are my screen shots to show what is displayed.
This is portrait mode which is looking fine ..
When I rotate my device it moves to landscape, but it is not showing button and below text view? Can I add scroll view ? or can I add in % percentage instead of dp?
Here is my code
<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"
tools:context=".MainActivity"
android:background="#223399"
android:orientation="vertical">
<TextView
android:layout_marginTop="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceLarge"
android:text="Login here"
android:gravity="center"
/>
<EditText
android:layout_marginTop="80dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
/>
<EditText
android:layout_marginTop="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
/>
<Button
android:layout_marginTop="80dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/loginClick"
android:layout_gravity="center"
/>
<TextView
android:layout_marginTop="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceMedium"
android:text="New User?"
android:textColor="#00eeff"
android:gravity="center"
android:id="#+id/regiester_id"
/>
</LinearLayout>
java code
public static final String MyPREFERENCES = "MyPrefs" ;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
How can I set the screen up so that it looks good in portrait as well as landscape mode?
Update code
<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"
tools:context=".MainActivity"
android:background="#223399"
android:orientation="vertical">
<ScrollView
android:layout_width="match_parent"
android:layout_height="fill_parent">
<TextView
android:layout_marginTop="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceLarge"
android:text="Login here"
android:gravity="center"
/>
<EditText
android:layout_marginTop="80dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
/>
<EditText
android:layout_marginTop="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
/>
<Button
android:layout_marginTop="80dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/loginClick"
android:layout_gravity="center"
/>
<TextView
android:layout_marginTop="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceMedium"
android:text="New User?"
android:textColor="#00eeff"
android:gravity="center"
android:id="#+id/regiester_id"
/>
</ScrollView>
</LinearLayout>

I gave it a quick try using layout_weight. You can more fine tune it using different weights.
<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"
tools:context=".MainActivity"
android:background="#223399"
android:orientation="vertical"
android:weightSum="5">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceLarge"
android:text="Login here"
android:gravity="center"
android:layout_weight="1"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_weight="1"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/loginClick"
android:layout_gravity="center"
android:layout_weight="1"
/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceMedium"
android:text="New User?"
android:textColor="#00eeff"
android:gravity="center"
android:id="#+id/regiester_id"
android:layout_weight="1"
/>
</LinearLayout>

when i rotate my device it move to landscape .it is not showing button
and below text view ? can I add scroll view ? or can I add in %
percentage instead of dp.
I would say use ScrollView for better screen adjustment, it will be helpful in smaller device screens too.
also you can make different types of layouts for every size of screens and for landscape and portrait.
please refer to developer's site for types of screen layouts.
I hope you will get info for different types of screen size from there.

ScrollView must have only one child, try to change your code like that:
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".MainActivity"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#223399">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_marginTop="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceLarge"
android:text="Login here"
android:gravity="center"
/>
<EditText
android:layout_marginTop="80dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
/>
<EditText
android:layout_marginTop="20dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
/>
<Button
android:layout_marginTop="80dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Login"
android:id="#+id/loginClick"
android:layout_gravity="center"
/>
<TextView
android:layout_marginTop="40dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAppearance="?android:textAppearanceMedium"
android:text="New User?"
android:textColor="#00eeff"
android:gravity="center"
android:id="#+id/regiester_id"
/>
</LinearLayout>
</ScrollView>

Scroll View Must have one child. So update your code with below and seee its working or not.
<ScrollView 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="#223399"
tools:context=".MainActivity" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:gravity="center"
android:text="Login here"
android:textAppearance="?android:textAppearanceLarge" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="80dp"
android:hint="Username" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="20dp"
android:hint="Password" />
<Button
android:id="#+id/loginClick"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="80dp"
android:text="Login" />
<TextView
android:id="#+id/regiester_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:gravity="center"
android:text="New User?"
android:textAppearance="?android:textAppearanceMedium"
android:textColor="#00eeff" />
</LinearLayout>
</ScrollView>

How do I ensure the buttons align horizontally in this Android login dialog?

I'm creating a login dialog on Android where I want two buttons to align horizontally both on the top and bottom edge, irregardless of the screen size. Sometimes "Forgot password" will break over two lines, sometimes not. I do not want to impose a minHeight on the buttons, and would prefer a solution based on XML design only (not code).
Landscape is fine:
Portrait, default implementation leaves the login button shorter than "forgot password"
One solution I tried was setting match_parent for the layout_height param of the first button. Didn't quite work:
XML:
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/terms_layout"
android:layout_marginTop="10dp"
>
<Button
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/login"
android:textSize="18sp"
android:id="#+id/dialog_login_button_login"
/>
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/forgotPassword"
android:textSize="18sp"
android:id="#+id/dialog_login_button_forgot_password"
/>
</LinearLayout>

Use RelativeLayout and make "Login" button to align to the top and bottom of "Forgot Password" Button

As #manjusg answered, make the Login button align the bottom and top to the other button.
Here is how I did it:
<?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">
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Email" />
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Password" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/terms_layout"
android:layout_marginTop="10dp">
<View
android:id="#+id/center_strut"
android:layout_height="0dp"
android:layout_width="0dp"
android:layout_centerInParent="true" />
<Button
android:layout_width="0dp"
android:layout_height="0dp"
android:text="Login"
android:textSize="18sp"
android:layout_alignParentLeft="true"
android:layout_alignRight="#+id/center_strut"
android:layout_alignBottom="#+id/dialog_login_button_forgot_password"
android:layout_alignTop="#+id/dialog_login_button_forgot_password"
android:id="#+id/dialog_login_button_login" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignLeft="#+id/center_strut"
android:text="Forgot Password"
android:textSize="18sp"
android:id="#+id/dialog_login_button_forgot_password" />
</RelativeLayout>
</LinearLayout>

replace your xml with this xml
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:id="#+id/terms_layout"
android:layout_marginTop="10dp"
android:weightSum="2"
>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
>
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="#string/login"
android:textSize="18sp"
android:id="#+id/dialog_login_button_login"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
>
<Button
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:text="#string/forgotPassword"
android:textSize="18sp"
android:id="#+id/dialog_login_button_forgot_password"
android:layout_alignParentTop="true"
android:layout_alignParentBottom="true"
/>
</RelativeLayout>
</LinearLayout>

check this
<RelativeLayout 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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout">
<Button
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="Login"
android:id="#+id/button"/>
<Button
android:layout_weight="1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:text="FORGOT PASSWORD"
android:id="#+id/button2"/>
</LinearLayout>
<LinearLayout
android:layout_alignBottom="#+id/linearLayout"
android:layout_width="wrap_content"
android:layout_centerInParent="true"
android:paddingTop="6dp"
android:paddingBottom="6dp"
android:layout_height="wrap_content">
<View
android:layout_width="0.5dp"
android:layout_height="wrap_content"
android:background="#000000"/>
</LinearLayout>
</RelativeLayout>

layout_weight: Text is not displayed

I was trying to make an interface that allows horizontal texts to be equally space, using layout_weight for responsiveness
So, I tried the code below
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:background="#android:color/darker_gray">
<TextView
android:gravity="center"
android:text="Guest List"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="24sp"
android:background="#android:color/holo_blue_bright"/>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white">
<TextView
android:text="Kunal"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="24sp"/>
<TextView
android:text="Darling"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="24sp"/>
<TextView
android:text="Shocker"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textSize="24sp"/>
</LinearLayout>
However, all the texts disappear.
So, could anyone please kindly explain to me what happened and how to fix this problem?

Try this,
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/darker_gray"
android:gravity="center_vertical"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/holo_blue_bright"
android:gravity="center"
android:text="Guest List"
android:textSize="24sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/white"
android:orientation="horizontal" >
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Kunal"
android:textSize="24sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Darling"
android:textSize="24sp" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Shocker"
android:textSize="24sp" />
</LinearLayout>
</LinearLayout>

Using a white background color in the second LinearLayout, you may be trying to see white on white text.
I'd try to add to the TextViews something along:
android:textColor="#android:color/black"

Modifying login Page design to make login button always visible

I have the following layout for login page,i need to reduce the spacing between each element,in short i need to move username,password and login button upwards of the screen ,that is when we open virtual keyboard the login button should be visible always,i tried using 'margintop=-negative value',its not working out.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:andriod="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/loginbackmain"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:orientation="vertical" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:src="#drawable/ic_launcher" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_weight="1"
android:gravity="top"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:gravity="top"
android:background="#drawable/loginformback"
android:orientation="vertical"
android:weightSum="1">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:id="#+id/editText1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:layout_weight="1"
android:drawableLeft="#android:drawable/ic_menu_day"
android:ems="10"
android:hint="username" >
<requestFocus />
</EditText>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="-30dp">
<EditText
android:id="#+id/editText2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:drawableLeft="#android:drawable/ic_menu_day"
android:ems="10"
android:hint="password"
android:inputType="textPassword" />
</LinearLayout>
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="5dp"
android:onClick="login"
android:text="Login"
andriod:background="#A0522D"/>
<ProgressBar
android:id="#+id/progressBar1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:visibility="invisible"
/>
</LinearLayout>
</LinearLayout>
</LinearLayout>

Set
android:windowSoftInputMode="stateVisible|adjustPan"
in Android manifest file inside tag

layout real estate android

I have several view components in a layout. most of them have visibility=gone and they are turned on only based on certain conditions and this is done programatically.
All of this works fine but even though visibility=gone, there is a blank space occupying that area. how do i remove that>
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:weightSum="1" android:layout_height="wrap_content"
android:background="#drawable/subheader_gradient" android:orientation="horizontal"
android:layout_width="fill_parent" android:id="#+id/_searchLayout">
<EditText android:layout_width="fill_parent" android:id="#+id/_search"
android:layout_height="wrap_content" android:textColor="#color/black"
android:layout_gravity="center" android:background="#color/white"
android:layout_alignParentTop="true" android:layout_margin="10dp"
style="#style/formValue" android:singleLine="true"
android:inputType="textNoSuggestions|textVisiblePassword|textCapCharacters"
android:autoText="false" android:lines="1"
android:hint="#string/_Text_searchBy" android:maxLines="1"
android:textColorHint="#color/light_gray" android:textScaleX="1"
android:textSize="7pt" />
</LinearLayout>
<TextView style="#style/SubHeaderText" android:text="#string/_Heading_searchResults"
android:id="#+id/_HeadingsearchResults"
android:layout_height="wrap_content" android:layout_width="fill_parent"
android:background="#drawable/subheader_gradient" android:visibility="gone"></TextView>
<TextView android:layout_width="fill_parent"
android:visibility="gone" android:id="#+id/_HeadingsearchResultsNull"
android:layout_height="wrap_content" android:text="#string/_Text_noSymbolsFounds"
android:textColor="#color/light_gray" style="#style/formLabel"
android:layout_gravity="center" android:background="#color/white" />
<LinearLayout android:layout_height="wrap_content"
android:orientation="horizontal" android:layout_width="fill_parent"
android:id="#+id/_progressLayout" android:background="#color/white"
android:visibility="gone">
<ProgressBar style="#android:style/Widget.ProgressBar.Small.Inverse"
android:layout_height="wrap_content" android:layout_width="wrap_content"
android:layout_gravity="left" android:id="#+id/_progress"
android:padding="5dip"></ProgressBar>
<TextView android:id="#+id/_progressText"
android:text="#string/_Heading_searching"
android:gravity="center|center_vertical" android:layout_height="wrap_content"
android:layout_width="wrap_content" android:padding="5dip"
android:textColor="#color/black" android:textSize="15dp"
android:layout_gravity="center_vertical|center" />
</LinearLayout>
<ListView android:fadeScrollbars="true" android:scrollbars="vertical"
android:id="#+id/_searchSymbol_list" android:layout_width="match_parent"
android:layout_height="wrap_content" android:visibility="gone"
android:scrollbarAlwaysDrawVerticalTrack="true" android:background="#color/white"
android:cacheColorHint="#color/white" />
<TextView style="#style/SubHeaderText" android:text="#string/_Heading_recentResults"
android:id="#+id/_recentResults" android:layout_height="wrap_content"
android:layout_width="fill_parent" android:background="#drawable/subheader_gradient"></TextView>
<ListView android:fadeScrollbars="true" android:scrollbars="vertical"
android:id="#+id/_recentQuotes_list" android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbarAlwaysDrawVerticalTrack="true" android:background="#color/white"
android:cacheColorHint="#color/white" />

Try to send your layout XML. Or if you want to identify, which layout is causing problems, set different background color for each one and then you can try different parameters for layout size.