I'm new in the world of Android development, and I'm trying to learn how to getting started from here.
Now I've followed all steps until to put the Zip Code and the Number on the same line. I don't understand how can I manage this, if I drag and drop the Number control beside the TextView the IDE put the Number above the control or to the bottom. I don't know how to explain correctly, anyway, this is an image:
and this is the source code:
<?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
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relativeLayout1" />
<EditText
android:inputType="number"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeEdit"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:layout_width="100sp"
android:textColor="#9933FF" />
<TextView
android:text="Zip Code: "
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeLabel"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp" />
</LinearLayout>
from the site should be like this:
what is wrong? Sorry if something is not clear, or if the category tag is wrong.
Try This
<?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="vertical" >
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:minHeight="25px"
android:minWidth="25px" >
<EditText
android:id="#+id/ZipCodeEdit"
android:layout_width="100sp"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:inputType="number"
android:textColor="#9933FF"
android:textSize="20sp" />
<TextView
android:id="#+id/ZipCodeLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_toRightOf="#+id/ZipCodeEdit"
android:text="Zip Code: "
android:textSize="20sp" />
</RelativeLayout>
</LinearLayout>
You should make proper use of LinearLayout, RelativeLayout, FrameLayout and TableLayout for the desired alignments.
Here is your solution.:
<?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
android:minWidth="25px"
android:minHeight="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/relativeLayout1" >
<EditText
android:inputType="number"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeEdit"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:layout_width="100sp"
android:textColor="#9933FF" />
<TextView
android:text="Zip Code: "
android:layout_width="match_parent"
android:layout_toRightOf="#+id/ZipCodeEdit"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeLabel"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:textSize="20sp" />
</RelativeLayout>
</LinearLayout>
What you were doing Wrong :
You are trying to align EditText and TextView one beside another inside RelativeLayout but you've closed the relative layiut right where it started.
that makes the EditText and TextView the child view of the LinearLayout(Vertical)
As the text views are behaving as the children of Linear vertical layout there is no use of RelativeLayout hence aligning both views one below another.
One more thing when you fix that and put both the text view within RelativeLayout you have to align one view in relation with the another.
In this case:
android:layout_toRightOf="#+id/ZipCodeEdit"
Let me know if any problem.
Happy Coding
You are using a vertical LinearLayout as the parent layout.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
Change android:orientation="vertical" to android:orientation="horizontal".
You can also remove the RelativeLayout as it's not really being used(nothing inside it).
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<EditText
android:inputType="number"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeEdit"
android:layout_marginLeft="10dp"
android:textSize="20sp"
android:layout_width="100dp"
android:textColor="#9933FF" />
<TextView
android:text="Zip Code: "
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/ZipCodeLabel"
android:layout_marginLeft="10dp"
android:textSize="20sp" />
</LinearLayout>
This should fix your problem. I will explain if this works for you.
Related
I have this simple activity in my android app but I don't know how to place my button so it appears at the same position on various screen sizes.
I want the button to always be placed at the bottom of the screen. The screenshot shown is from a phone screen. When displayed on a larger screen the button is higher up.
How can I fix this?
Thanks
See this screenshot
You can use RelativeLayout with this parameter (android:layout_alignParentBottom="true")
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Click Me!"/>
</RelativeLayout>
You should use a RelativeLayout
If you have a RelativeLayout that fills the whole screen you should be able to use android:layout_alignParentBottom to move the button to the bottom of the screen.
If your button at the bottom doesn't show then probably the layout above it takes all the space. In this case you can put the button first in your layout file and position the rest of the layout above the views with android:layout_above.
Have a look a RelativeLayout. Use this ViewGroup and add a Button inside it with alignParentBottom
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
<Button
android:id="#+id/button_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:alignParentBottom="true"
android:text="HORAIRE"
android:layout_margins="<your_margin_in_dp>" />
</RelativeLayout>
Make footerButton.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:text="HORAIRE"
android:textColor="#ffffff"
android:textSize="20sp" />
</RelativeLayout>
And add it in all your layout file like below line:
Android Activity_Layout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Footer aligned to bottom -->
<include layout="#layout/footer" />
<!-- Content above footer -->
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/footer"
android:layout_below="#id/header"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Content goes here"
android:textColor="#FFFFFF"
android:textSize="20sp" />
</RelativeLayout>
</RelativeLayout>
Hope it will solve your problem
This is what I ended up doing. Thanks to everyone who posted, it helped me get in the right direction!
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"
tools:context="xxxx.MainActivity"
android:orientation="vertical"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dernières nouvelles Twitter"
android:id="#+id/textView"
android:textStyle="bold"
android:textSize="17dp"
android:paddingLeft="8dp"
android:paddingTop="6dp"
android:paddingRight="6dp"
android:paddingBottom="6dp"
android:layout_alignParentTop="true"/>
<ListView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:id="#+id/listView_tweets"
android:layout_above="#+id/buttonDisplay"
android:choiceMode="none"
android:paddingTop="25dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Horaire"
android:layout_margin="5dp"
android:id="#+id/buttonDisplay"
android:onClick="buttonGotoDisplay"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
I have two edittext views. One of them has only one line, its the title. But the other one should fill the linearlayout to the end, but it doesn't.
I updated the code so this is my whole xml for this app. I hope someone can find what's wrong. The part that i want to form like this is the part inside the LinearLayout named addView.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mainLayout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:background="#ffffff">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<Button
android:id="#+id/addButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/addbuttonstyle"
android:layout_weight="20"/>
<ImageView
android:id="#+id/titleView"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/titleview"
android:layout_weight="60"/>
<Button
android:id="#+id/orderButton"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/orderbuttonstyle"
android:layout_weight="20"/>
</LinearLayout>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/addView"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<EditText
android:id="#+id/textBoxTitle"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="note title"
android:singleLine="true"
/>
<EditText
android:id="#+id/textBoxContent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:hint="content"
/>
</LinearLayout>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/backgroundLayout"
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/background"
/>
</FrameLayout>
I changed textBoxTitle's height to wrap_content and I see this:
Is this what you were hoping for? Also if you want content to appear in the upper-left corner use this attribute:
<EditText
...
android:gravity="top"
/>
So i found what was wrong.
I needed to set layout_height (of the textBoxContent view) to 0dp and layout_weight (of the textBoxContent view) to 1.
The first view should have android:layout_width="wrap_content"
I am having issues with creating a menu (not menu when you click menu button -- but menu as in the welcome screen to select items). I went to ImageView and TextView float (left/right) Android and I did not solve my issue. I would like to create at least five or six options to select from on this menu class. This is my menu.xml file. Please let me know what I need to do.
The issue is that the first item appears, but the second item overlaps the first item. I been picking away with this for the last hour and cannot solve this issue.
<?xml version="1.0" encoding="UTF-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dp">
<TextView
android:textSize="18dp"
android:id="#+id/message_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text=" Check Your Account" />
<ImageView
android:src="#drawable/ic_menu_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/icon" />
<TextView
android:textSize="18dp"
android:id="#+id/message_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text=" View our Site" />
<ImageView
android:src="#drawable/ic_menu_add"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
thannk you.
Why don't you use a LinearLayout (like a vertical one with severals little horizontal ones inside, each with a TextView and an ImageView) ?
Anyway, if you want to use RelativeLayout you should use something like android:layout_toRightOf, android:layout_toLeftOf, android:layout_above or android:layout_below in your xml to place your elements.
I advise you to take a look at http://developer.android.com/reference/android/widget/RelativeLayout.LayoutParams.html if you don't know those parameters.
You use a RelativeLayout but you don't place elements with reference to each other.
Example :
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<Button android:id="#+id/topBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Top"
android:layout_centerHorizontal="true">
</Button>
<Button android:id="#+id/leftBtn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left"
android:layout_below="#+id/topBtn"
android:layout_toLeftOf="#+id/topBtn">
</Button>
</RelativeLayout>
http://developer.android.com/reference/android/widget/RelativeLayout.html
A Linear Layout would be better.
Try this and tell me if this is what you needed:
<?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:padding="5dp"
android:orientation="vertical"
>
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<TextView
android:id="#+id/message_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text=" Check Your Account"
android:textSize="18dp" />
<ImageView
android:id="#+id/icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_menu_add" android:layout_gravity="center_horizontal"/>
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/message_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text=" View our Site"
android:textSize="18dp" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_menu_add" android:layout_gravity="center_horizontal"/>
</LinearLayout>
</LinearLayout>
I am trying to create a UI using relative layout where in the UI should look as such:
In the top of the screen i have a TextView
followed by another TextView
followed by scroll view where in i have to display the text in the
scrollable format
in the end i have a imageview.
How can i achieve this.
I have tried using the combination of Relative and Linear Layout but the elements gets overlapped. Anyone have any suggestions on how to proceed?
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent"
android:background="#drawable/background_main" android:id="#+id/g_description">
<TextView android:id="#+id/titleBar" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:background="#drawable/header"
android:layout_alignParentTop="true" android:gravity="center"
android:text="#string/aboutus" android:textAppearance="? android:attr/textAppearanceLarge"
android:textStyle="bold" />
<TextView android:id="#+id/wd_name"
android:layout_width="fill_parent" android:layout_below="#id/titleBar"
android:layout_height="wrap_content" android:textStyle="bold"
android:textColor="#FFFFFF" android:textSize="18dip"
android:background="#drawable/background_main" android:gravity="center" />
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/scrolltext" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:layout_below="#id/wd_name"
android:padding="5dip">
<LinearLayout android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/wd_description"
android:layout_width="fill_parent" android:layout_height="wrap_content"
android:textSize="14dip" android:textColor="#FFFFFF">
</TextView>
</LinearLayout>
</ScrollView>
<ImageView android:id="#+id/bottomBar" android:layout_width="fill_parent"
android:layout_height="wrap_content" android:src="#drawable/bottom_bar"
android:layout_alignParentBottom="true" />
you can achieve it like this:
Take relative layout and put textview in it.
Take another textview and add this to it android:layout_below="id of the 1st textview".
Take scrollview and add this to it android:layout_below="id of the 2nd textview".
Take linear layout inside scrollview.
Put textview inside linear layout.
Take imageview and add this to it android:layout_below="id of the scrollview".
Now your layout is ready and if you get any error then let me know with your code....
If you have a series of elements that you want to flow down the screen, then it sounds like you just need a LinearLayout.
It goes as below. Placing a TextView inside scrollview will make it scrollable. Reset is selfexplanary.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView android:layout_height="wrap_content" android:layout_width="fill_parent" android:text="Below TOP TextView" android:id="#+id/TextView01" android:layout_alignParentTop="true"></TextView>
<TextView android:layout_height="wrap_content" android:layout_width="fill_parent" android:text="TOP TextView" android:id="#+id/TextView02" android:layout_below="#id/TextView01"></TextView>
<ScrollView android:layout_height="wrap_content" android:layout_width="fill_parent" android:fillViewport="true" android:layout_below="#id/TextView02">
<TextView android:id="#+id/textView1" android:layout_height="wrap_content" android:text="Scrollable textViewafkasjf;laksjflaskjf;lasjf;alsfjal;sfj;aslfj;aslfja;slfj;aslkfj;asldfj;aslkfjasl;dfj;a asfj aslfj asldfjk as;lfjk asfjka;sldf jl;asj df;asdfjasfj aslfj asljf asjfl;asfasj fasj f;asj flas jf;lasjf;asjkf;las f;asj df;as jf;lasjf ;asjf;asjf;asjf;asjf;asjf;jasf;asfja s;dfa;sf asf jf asf a; sldfja;slfj;asldfjk" android:layout_width="fill_parent"></TextView>
</ScrollView>
<ImageView android:src="#drawable/icon" android:layout_height="wrap_content" android:id="#+id/imageView1" android:layout_alignParentBottom="true" android:layout_centerHorizontal="true" android:layout_width="fill_parent"></ImageView>
</RelativeLayout>
It works fine with setting android:orientation="vertical" for each text view.
I am pretty sure that a parameter will do the trick but I can't find the one I am looking for.
I am trying to display one TextView -file_type- below the file_title TextView.
What would be the parameter that I should add to the file_type TevxtView block to come under the file_title TextView block ?
There is what I am doing :
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView android:id="#+id/file_type_logo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="25px"
android:paddingTop="25px" />
<TextView android:id="#+id/file_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="30px"
android:textSize="22sp"
android:background="#FF0000"
android:textColor="#FFFFFF" />
<TextView android:id="#+id/file_type"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="30px"
android:paddingTop="10px"
android:layout_gravity="bottom"
android:textSize="22sp"
android:background="#FF0000"
android:textColor="#FFFFFF" />
</LinearLayout>
Thank you ,
By default linearlayout wraps things horizontally. If you want the imageview to be at the left of the both textviews (that are wrapped vertically), use following:
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView .../>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:orientation="vertical">
<TextView1..../>
<TextView2..../>
</LinearLayout>
</LinearLayout>
Or you can just pass the parameter android:orientation="vertical" to the top level LinearLayout. Have a look at RelativeLayout definition as well.