A simple coding blog for new graduates

I am about to explode your world in Android UI XML design. This is a great way for new programmers to really expand their UIs to become much more robust and gives you a way to really get things looking how you want them on all screen size!

<?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"
>
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="@drawable/headerimage"
/>
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
android:padding="10dp"
>
	<TextView
	android:layout_width="fill_parent"
	android:layout_height="wrap_content"
	android:textSize="30dp"
	android:text="This is a Text View for the title""
	/>
	<LinearLayout
	android:layout_width="fill_parent"
	android:layout_height="wrap_content"
	android:orientation="horizontal"
	android:padding ="5dp"
	>
		<ImageView
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:src="@drawable/something"
		android:padding="5dp"
		/>
		<TextView
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:text="Heres text about this image!"
		/>
	</LinearLayout>
	<LinearLayout
	android:layout_width="fill_parent"
	android:layout_height="wrap_content"
	android:orientation="horizontal"
	android:padding ="5dp"
	>
		<ImageView
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:src="@drawable/somethingelse"
		android:padding="5dp"
		/>
		<TextView
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:text="And heres text about this image!"
		/>
	</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>

What we want to accomplish is a screen that has a header/banner image, and then below it a way for the user to scroll and see a bunch of contents.

To do this, you can see we start with a linear layout, and then put our banner. Then below, we put a ScrollView. You might have had problems with scroll views before, and the problem was probably relating to the fact you probably tried to put a whole bunch of things in it, but then realized you can only have 1 view in a ScrollView! So to get around that, you put ANOTHER view in the scroll view. Here, I put another linear layout, but it could also be a relative or absolute o r frame or whatever. THEN inside this linear layout, I have MORE linear layouts! And then in those layouts I finally put actual objects that we are so used to.

I hope this helps you out, feel free to post any questions or comments, maybe even some screenshots or code of the ridiculous layouts you’re defining!

-Kevin Grant