Skip to content

Commit

Permalink
Collapsing Toolbar added and is woring fine.
Browse files Browse the repository at this point in the history
  • Loading branch information
hishamMuneer committed Jun 10, 2015
1 parent 0334018 commit fbee037
Show file tree
Hide file tree
Showing 13 changed files with 266 additions and 19 deletions.
5 changes: 3 additions & 2 deletions app/src/main/AndroidManifest.xml
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@
android:allowBackup="true"
android:icon="@mipmap/ic_launcher"
android:label="@string/app_name"
android:theme="@style/Theme.AppCompat.Light" >
android:theme="@style/AppTheme" >
<activity
android:name=".MyListActivity"
android:label="@string/title_activity_my_list" >
Expand Down Expand Up @@ -38,7 +38,8 @@
</activity>
<activity
android:name=".CollapsingToolbars"
android:label="@string/collapsing_toolbars" >
android:label="@string/collapsing_toolbars"
android:theme="@style/NoActionBarTheme">
</activity>
</application>

Expand Down
65 changes: 65 additions & 0 deletions app/src/main/java/com/hisham/design/CollapsingToolbars.java
Original file line number Diff line number Diff line change
@@ -1,19 +1,79 @@
package com.hisham.design;

import android.os.Bundle;
import android.support.design.widget.CollapsingToolbarLayout;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.ImageView;

/**
* Created by faisal pc on 6/9/2015.
*
* <div class="jd-descr">
<h2 style="margin-bottom: 0px;">Class Overview</h2><hr>
<p itemprop="articleBody">CollapsingToolbarLayout is a wrapper for <code><a href="/reference/android/support/v7/widget/Toolbar.html">Toolbar</a></code> which implements a collapsing app bar.
It is designed to be used as a direct child of a <code><a href="/reference/android/support/design/widget/AppBarLayout.html">AppBarLayout</a></code>.
CollapsingToolbarLayout contains the following features:
</p><h3>Collapsing title</h3>
A title which is larger when the layout is fully visible but collapses and becomes smaller as
the layout is scrolled off screen. You can set the title to display via
<code><a href="/reference/android/support/design/widget/CollapsingToolbarLayout.html#setTitle(java.lang.CharSequence)">setTitle(CharSequence)</a></code>. The title appearance can be tweaked via the
<code>collapsedTextAppearance</code> and <code>expandedTextAppearance</code> attributes.
<h3>Content scrim</h3>
A full-bleed scrim which is show or hidden when the scroll position has hit a certain threshold.
You can change this via <code><a href="/reference/android/support/design/widget/CollapsingToolbarLayout.html#setContentScrim(android.graphics.drawable.Drawable)">setContentScrim(Drawable)</a></code>.
<h3>Status bar scrim</h3>
A scrim which is show or hidden behind the status bar when the scroll position has hit a certain
threshold. You can change this via <code><a href="/reference/android/support/design/widget/CollapsingToolbarLayout.html#setStatusBarScrim(android.graphics.drawable.Drawable)">setStatusBarScrim(Drawable)</a></code>. This only works
on <code><a href="/reference/android/os/Build.VERSION_CODES.html#LOLLIPOP">LOLLIPOP</a></code> devices when we set to fit system windows.
<h3>Parallax scrolling children</h3>
Child views can opt to be scrolled within this layout in a parallax fashion.
See <code><a href="/reference/android/support/design/widget/CollapsingToolbarLayout.LayoutParams.html#COLLAPSE_MODE_PARALLAX">COLLAPSE_MODE_PARALLAX</a></code> and
<code><a href="/reference/android/support/design/widget/CollapsingToolbarLayout.LayoutParams.html#setParallaxMultiplier(float)">setParallaxMultiplier(float)</a></code>.
<h3>Pinned position children</h3>
Child views can opt to be pinned in space globally. This is useful when implementing a
collapsing as it allows the <code><a href="/reference/android/support/v7/widget/Toolbar.html">Toolbar</a></code> to be fixed in place even though this layout is
moving. See <code><a href="/reference/android/support/design/widget/CollapsingToolbarLayout.LayoutParams.html#COLLAPSE_MODE_PIN">COLLAPSE_MODE_PIN</a></code>.<p></p>
</div>
*
*/
public class CollapsingToolbars extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_collaping_toolbars_layout);

final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
getSupportActionBar().setHomeButtonEnabled(true);

CollapsingToolbarLayout collapsingToolbar =
(CollapsingToolbarLayout) findViewById(R.id.collapsing_toolbar);
collapsingToolbar.setTitle("Wow Koala");

loadBackdrop();
}

private void loadBackdrop() {
final ImageView imageView = (ImageView) findViewById(R.id.backdrop);
// Glide.with(this).load(Cheeses.getRandomCheeseDrawable()).centerCrop().into(imageView);
imageView.setImageResource(R.drawable.koala);
}

@Override
Expand All @@ -30,6 +90,11 @@ public boolean onOptionsItemSelected(MenuItem item) {
// as you specify a parent activity in AndroidManifest.xml.
int id = item.getItemId();

if(id == R.id.home){
finish();
return true;
}

//noinspection SimplifiableIfStatement
if (id == R.id.action_settings) {
return true;
Expand Down
2 changes: 1 addition & 1 deletion app/src/main/java/com/hisham/design/MyListActivity.java
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ protected void onCreate(Bundle savedInstanceState) {
myListView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
startActivity(new Intent(getApplicationContext(), classes[position]));
MyListActivity.this.startActivity(new Intent(getApplicationContext(), classes[position]));
}
});

Expand Down
Binary file added app/src/main/res/drawable/ic_discuss.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/koala.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added app/src/main/res/drawable/tulips.jpg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
161 changes: 150 additions & 11 deletions app/src/main/res/layout/activity_collaping_toolbars_layout.xml
Original file line number Diff line number Diff line change
@@ -1,27 +1,166 @@
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
<?xml version="1.0" encoding="utf-8"?>
<!--
~ Copyright (C) 2015 The Android Open Source Project
~
~ Licensed under the Apache License, Version 2.0 (the "License");
~ you may not use this file except in compliance with the License.
~ You may obtain a copy of the License at
~
~ http://www.apache.org/licenses/LICENSE-2.0
~
~ Unless required by applicable law or agreed to in writing, software
~ distributed under the License is distributed on an "AS IS" BASIS,
~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
~ See the License for the specific language governing permissions and
~ limitations under the License.
-->

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/parentLayout"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/main_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.hisham.design.CoordinatorLayoutActivity">
android:fitsSystemWindows="true"
tools:context=".CollapsingToolbars">

<android.support.design.widget.AppBarLayout
android:id="@+id/appbar"
android:layout_width="match_parent"
android:layout_height="192dp">
android:layout_height="256dp"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
android:fitsSystemWindows="true">

<android.support.design.widget.CollapsingToolbarLayout
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:id="@+id/collapsing_toolbar"
android:layout_width="match_parent"
android:layout_height="match_parent">

android:layout_height="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:fitsSystemWindows="true"
app:contentScrim="?attr/colorPrimary"
app:expandedTitleMarginStart="48dp"
app:expandedTitleMarginEnd="64dp">

<ImageView
android:id="@+id/backdrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="centerCrop"
android:fitsSystemWindows="true"
app:layout_collapseMode="parallax" />

<android.support.v7.widget.Toolbar
app:layout_collapseMode="pin"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize" />
android:layout_height="?attr/actionBarSize"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
app:layout_collapseMode="pin" />

</android.support.design.widget.CollapsingToolbarLayout>

</android.support.design.widget.AppBarLayout>
</RelativeLayout>

<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingTop="24dp">

<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="16dp">

<LinearLayout
style="@style/Widget.CardContent"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Info"
android:textAppearance="@style/TextAppearance.AppCompat.Title" />

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/cheese_ipsum" />

</LinearLayout>

</android.support.v7.widget.CardView>

<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/card_margin"
android:layout_marginLeft="@dimen/card_margin"
android:layout_marginRight="@dimen/card_margin">

<LinearLayout
style="@style/Widget.CardContent"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Friends"
android:textAppearance="@style/TextAppearance.AppCompat.Title" />

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/cheese_ipsum" />

</LinearLayout>

</android.support.v7.widget.CardView>

<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/card_margin"
android:layout_marginLeft="@dimen/card_margin"
android:layout_marginRight="@dimen/card_margin">

<LinearLayout
style="@style/Widget.CardContent"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Related"
android:textAppearance="@style/TextAppearance.AppCompat.Title" />

<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="@string/cheese_ipsum" />

</LinearLayout>

</android.support.v7.widget.CardView>

</LinearLayout>

</android.support.v4.widget.NestedScrollView>

<android.support.design.widget.FloatingActionButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
app:layout_anchor="@id/appbar"
app:layout_anchorGravity="bottom|right|end"
android:src="@drawable/ic_discuss"
android:layout_margin="16dp"
android:clickable="true"/>

</android.support.design.widget.CoordinatorLayout>
7 changes: 5 additions & 2 deletions app/src/main/res/menu/menu_tab_layout.xml
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,9 @@
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
tools:context="com.hisham.design.TabLayoutActivity">
<item android:id="@+id/action_settings" android:title="@string/action_settings"
android:orderInCategory="100" app:showAsAction="never" />
<item
android:id="@+id/action_settings"
android:orderInCategory="100"
android:title="@string/action_settings"
app:showAsAction="never" />
</menu>
10 changes: 9 additions & 1 deletion app/src/main/res/values-v21/styles.xml
Original file line number Diff line number Diff line change
@@ -1,5 +1,13 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<style name="AppTheme" parent="android:Theme.Material.Light">
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#673AB7</item>
<item name="colorPrimaryDark">#512DA8</item>
<item name="colorAccent">#FF4081</item>
<item name="android:windowBackground">@color/windowBG</item>
</style>

<style name="NoActionBarTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
</style>
</resources>
4 changes: 4 additions & 0 deletions app/src/main/res/values/colors.xml
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="windowBG">#FFF5F5F5</color>
</resources>
5 changes: 5 additions & 0 deletions app/src/main/res/values/dimens.xml
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,9 @@
<!-- Default screen margins, per the Android Design guidelines. -->
<dimen name="activity_horizontal_margin">16dp</dimen>
<dimen name="activity_vertical_margin">16dp</dimen>

<dimen name="detail_backdrop_height">256dp</dimen>
<dimen name="card_margin">16dp</dimen>
<dimen name="fab_margin">16dp</dimen>
<dimen name="list_item_avatar_size">40dp</dimen>
</resources>
7 changes: 7 additions & 0 deletions app/src/main/res/values/strings.xml
Original file line number Diff line number Diff line change
Expand Up @@ -17,5 +17,12 @@
<string name="title_activity_tab_layout">TabLayoutActivity</string>
<string name="title_activity_coordinator_layout">CoordinatorLayoutActivity</string>
<string name="collapsing_toolbars">Collapsing Toolbars</string>
<string name="lorem_ipsum_long">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Consequens enim est et post oritur, ut dixi. Illa tamen simplicia, vestra versuta. Sic vester sapiens magno aliquo emolumento commotus cicuta, si opus erit, dimicabit. Teneo, inquit, finem illi videri nihil dolere. Hoc loco tenere se Triarius non potuit. Ubi ut eam caperet aut quando? Quod cum dixissent, ille contra. Non dolere, inquam, istud quam vim habeat postea videro; Si longus, levis dictata sunt. Non enim quaero quid verum, sed quid cuique dicendum sit. Multoque hoc melius nos veriusque quam Stoici. Facile est hoc cernere in primis puerorum aetatulis. Hoc Hieronymus summum bonum esse dixit. Quo invento omnis ab eo quasi capite de summo bono et malo disputatio ducitur. Oratio me istius philosophi non offendit; Ita fit cum gravior, tum etiam splendidior oratio. De illis, cum volemus. Gerendus est mos, modo recte sentiat. Tum Piso: Quoniam igitur aliquid omnes, quid Lucius noster? Sed tamen intellego quid velit. Quis non odit sordidos, vanos, leves, futtiles? Te ipsum, dignissimum maioribus tuis, voluptasne induxit, ut adolescentulus eriperes P. Traditur, inquit, ab Epicuro ratio neglegendi doloris. Solum praeterea formosum, solum liberum, solum civem, stultost; Nunc haec primum fortasse audientis servire debemus. Qui-vere falsone, quaerere mittimus-dicitur oculis se privasse; Deprehensus omnem poenam contemnet. Hoc Hieronymus summum bonum esse dixit. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Consequens enim est et post oritur, ut dixi. Illa tamen simplicia, vestra versuta. Sic vester sapiens magno aliquo emolumento commotus cicuta, si opus erit, dimicabit. Teneo, inquit, finem illi videri nihil dolere. Hoc loco tenere se Triarius non potuit. Ubi ut eam caperet aut quando? Quod cum dixissent, ille contra. Non dolere, inquam, istud quam vim habeat postea videro; Si longus, levis dictata sunt. Non enim quaero quid verum, sed quid cuique dicendum sit. Multoque hoc melius nos veriusque quam Stoici. Facile est hoc cernere in primis puerorum aetatulis. Hoc Hieronymus summum bonum esse dixit. Quo invento omnis ab eo quasi capite de summo bono et malo disputatio ducitur. Oratio me istius philosophi non offendit; Ita fit cum gravior, tum etiam splendidior oratio. De illis, cum volemus. Gerendus est mos, modo recte sentiat. Tum Piso: Quoniam igitur aliquid omnes, quid Lucius noster? Sed tamen intellego quid velit. Quis non odit sordidos, vanos, leves, futtiles? Te ipsum, dignissimum maioribus tuis, voluptasne induxit, ut adolescentulus eriperes P. Traditur, inquit, ab Epicuro ratio neglegendi doloris. Solum praeterea formosum, solum liberum, solum civem, stultost; Nunc haec primum fortasse audientis servire debemus. Qui-vere falsone, quaerere mittimus-dicitur oculis se privasse; Deprehensus omnem poenam contemnet. Hoc Hieronymus summum bonum esse dixit.</string>

<string name="cheese_ipsum">Jarlsberg lancashire edam. Dolcelatte hard cheese brie st. agur blue
cheese caerphilly bavarian bergkase cheese and biscuits mascarpone. Cheeseburger swiss bavarian
bergkase cream cheese fromage frais cheesy feet port-salut airedale. St. agur blue cheese rubber
cheese caerphilly cheddar cheesecake cream cheese manchego lancashire. Roquefort squirty cheese
the big cheese.</string>

</resources>
19 changes: 17 additions & 2 deletions app/src/main/res/values/styles.xml
Original file line number Diff line number Diff line change
@@ -1,8 +1,23 @@
<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="android:Theme.Holo.Light.DarkActionBar">
<!-- Customize your theme here. -->
<style name="AppTheme" parent="Theme.AppCompat.Light">
<item name="colorPrimary">#673AB7</item>
<item name="colorPrimaryDark">#512DA8</item>
<item name="colorAccent">#FF4081</item>
<item name="android:windowBackground">@color/windowBG</item>
</style>

<style name="Widget.CardContent" parent="android:Widget">
<item name="android:paddingLeft">16dp</item>
<item name="android:paddingRight">16dp</item>
<item name="android:paddingTop">24dp</item>
<item name="android:paddingBottom">24dp</item>
<item name="android:orientation">vertical</item>
</style>

<style name="NoActionBarTheme" parent="Theme.AppCompat.Light.NoActionBar">
<item name="windowActionBar">false</item>
</style>

</resources>

0 comments on commit fbee037

Please sign in to comment.