Skip to content

Commit

Permalink
Modified the layouts to be better displayed on more device sizes. And…
Browse files Browse the repository at this point in the history
… added some "tools" attributes for better readibility in AS

	- The Image now uses as much space as possible.  The old 'dimen' made it look very small on a tablet.
	- The image is now in a FrameLayout and uses gravity 'center' for landscape and "center|bottom" for portrait
	- The image now has a weight of 2 in portrait mode, bringing it down a bit more.
	- Removed unneeded "alpha=1.0"
	- Added a new dimen : margin_between_title_and_description as it's not the same as activity_margin
  • Loading branch information
risesoftware committed Sep 10, 2016
1 parent ca8d0c5 commit cc6d2b2
Show file tree
Hide file tree
Showing 3 changed files with 123 additions and 92 deletions.
109 changes: 60 additions & 49 deletions onboarder/src/main/res/layout-land/fragment_onboarder.xml
Original file line number Diff line number Diff line change
@@ -1,51 +1,62 @@
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/activity_margin">


<ImageView
android:id="@+id/iv_onboarder_image"
android:layout_width="0dp"
android:layout_height="@dimen/section_image_item"
android:adjustViewBounds="true"
android:alpha="1.0"
android:layout_weight="1"
android:layout_gravity="center"
android:scaleType="fitCenter"/>


<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:layout_weight="1"
android:padding="@dimen/activity_margin">

<TextView
android:id="@+id/tv_onboarder_title"
style="@style/TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
tools:text="Section First"/>

<TextView
android:id="@+id/tv_onboarder_description"
style="@style/TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/activity_margin"
android:alpha="0.7"
android:gravity="center"
android:textColor="@color/white"
tools:text="A long description about my application"/>

</LinearLayout>

<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/activity_margin"
tools:background="@android:color/black"
>
<FrameLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margin="@dimen/activity_margin"
android:layout_weight="1"
>
<ImageView
android:id="@+id/iv_onboarder_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:adjustViewBounds="true"
android:scaleType="fitCenter"
android:contentDescription="@null"
tools:layout_width="100dp"
tools:layout_height="100dp"
tools:background="@color/white"
/>
</FrameLayout>

<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:layout_weight="1"
android:padding="@dimen/activity_margin"
>
<TextView
android:id="@+id/tv_onboarder_title"
style="@style/TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
tools:text="Section First"
/>

<TextView
android:id="@+id/tv_onboarder_description"
style="@style/TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/margin_between_title_and_description"
android:alpha="0.7"
android:gravity="center"
android:textColor="@color/white"
tools:text="A long description about my application"
/>

</LinearLayout>
</LinearLayout>
98 changes: 59 additions & 39 deletions onboarder/src/main/res/layout/fragment_onboarder.xml
Original file line number Diff line number Diff line change
@@ -1,46 +1,66 @@
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/activity_margin">
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="@dimen/activity_margin"
tools:background="@android:color/black"
>

<ImageView
android:id="@+id/iv_onboarder_image"
android:layout_width="@dimen/section_image_item"
android:layout_height="@dimen/section_image_item"
android:adjustViewBounds="true"
android:layout_gravity="center"
android:scaleType="fitCenter"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="2"
android:layout_margin="@dimen/activity_margin"
>
<ImageView
android:id="@+id/iv_onboarder_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:layout_gravity="bottom|center_horizontal"
android:scaleType="fitCenter"
android:contentDescription="@null"
tools:background="@color/white"
tools:layout_width="100dp"
tools:layout_height="100dp"
/>
<!--android:alpha="1.0"-->
</FrameLayout>

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:gravity="center"
android:orientation="vertical"
android:padding="@dimen/activity_margin">

<TextView
android:id="@+id/tv_onboarder_title"
style="@style/TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
tools:text="Section First"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="0dp"
android:layout_gravity="center"
android:gravity="center"
android:orientation="vertical"
android:layout_weight="1"
android:padding="@dimen/activity_margin"
>

<TextView
android:id="@+id/tv_onboarder_description"
style="@style/TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/activity_margin"
android:alpha="0.7"
android:gravity="center"
android:textColor="@color/white"
tools:text="A long description about my application"/>
<TextView
android:id="@+id/tv_onboarder_title"
style="@style/TextAppearance.AppCompat.Headline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/white"
tools:text="Section First"
/>

</LinearLayout>
<TextView
android:id="@+id/tv_onboarder_description"
style="@style/TextAppearance.AppCompat.Body1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/margin_between_title_and_description"
android:alpha="0.7"
android:gravity="center"
android:textColor="@color/white"
tools:text="A long description about my application"
/>

</FrameLayout>
</LinearLayout>
</LinearLayout>
8 changes: 4 additions & 4 deletions onboarder/src/main/res/values/dimen.xml
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="activity_margin">16dp</dimen>
<dimen name="activity_half_margin">8dp</dimen>
<dimen name="indicator_size">8dp</dimen>
<dimen name="section_image_item">192dp</dimen>
<dimen name="activity_margin">16dp</dimen>
<dimen name="indicator_size">8dp</dimen>

<dimen name="margin_between_title_and_description">8dp</dimen>
</resources>

0 comments on commit cc6d2b2

Please sign in to comment.