Android How To Create Bottom Sheet Full
1. Project Structure
Package name : full.bottomsheet.fyprojects.com.bottomsheetfull
2. Gradle
apply plugin: 'com.android.application'
android {
compileSdkVersion 28
defaultConfig {
applicationId "full.bottomsheet.fyprojects.com.bottomsheetfull"
minSdkVersion 16
targetSdkVersion 28
versionCode 1
versionName "1.0"
testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
dependencies {
implementation fileTree(dir: 'libs', include: ['*.jar'])
implementation 'com.android.support:appcompat-v7:28.0.0'
implementation 'com.android.support.constraint:constraint-layout:1.1.3'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
implementation 'com.android.support:design:28.0.0'
implementation 'com.android.support:support-v13:28.0.0'
implementation 'com.android.support:recyclerview-v7:28.0.0'
implementation 'com.github.bumptech.glide:glide:3.7.0'
implementation 'com.balysv:material-ripple:1.0.2'
}
3. Res Folder Dtructure
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<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/bgLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include layout="@layout/toolbar" />
</android.support.design.widget.AppBarLayout>
<android.support.v7.widget.RecyclerView
android:id="@+id/recyclerView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scrollbars="vertical"
android:scrollingCache="true"
app:layout_behavior="@string/appbar_scrolling_view_behavior" />
</android.support.design.widget.CoordinatorLayout>
fragment_bottom_sheet_dialog_full
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/lyt_parent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/transparent"
android:orientation="vertical">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar_layout"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageButton
android:id="@+id/bt_close"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="?attr/selectableItemBackgroundBorderless"
android:tint="@android:color/white"
app:srcCompat="@drawable/ic_close" />
<View
android:layout_width="30dp"
android:layout_height="0dp" />
<TextView
android:id="@+id/name_toolbar"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center_vertical"
android:text="New event"
android:textAppearance="@style/Base.TextAppearance.AppCompat.Title"
android:textColor="@android:color/white" />
<ImageButton
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="?attr/selectableItemBackgroundBorderless"
android:tint="@android:color/white"
app:srcCompat="@drawable/ic_create" />
<ImageButton
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="?attr/selectableItemBackgroundBorderless"
android:tint="@android:color/white"
app:srcCompat="@drawable/ic_more_vert" />
</LinearLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@android:color/white"
android:orientation="vertical"
android:padding="@dimen/spacing_large">
<LinearLayout
android:id="@+id/lyt_profile"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:layout_marginBottom="@dimen/spacing_xmedium"
android:gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="@+id/image"
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="@android:color/transparent"
android:src="@drawable/photo_female_1" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="0dp" />
<TextView
android:id="@+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Item Title"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_80" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/spacing_xmedium"
android:layout_marginTop="@dimen/spacing_xmedium"
android:orientation="horizontal">
<ImageButton
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="@android:color/transparent"
android:tint="@color/colorPrimary"
app:srcCompat="@drawable/ic_phone" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="0dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="(650) 555-1234"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_90" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Mobile"
android:textAppearance="@style/TextAppearance.AppCompat.Small"
android:textColor="@color/grey_40" />
</LinearLayout>
<ImageButton
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="?attr/selectableItemBackgroundBorderless"
android:tint="@color/green_500"
app:srcCompat="@drawable/ic_chat" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="(323) 555-6789"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_90" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Work"
android:textAppearance="@style/TextAppearance.AppCompat.Small"
android:textColor="@color/grey_40" />
</LinearLayout>
<ImageButton
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="?attr/selectableItemBackgroundBorderless"
android:tint="@color/green_500"
app:srcCompat="@drawable/ic_chat" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/spacing_large"
android:layout_marginTop="@dimen/spacing_large"
android:orientation="horizontal">
<View
android:layout_width="?attr/actionBarSize"
android:layout_height="0dp" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="0dp" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/grey_10" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/spacing_xmedium"
android:layout_marginTop="@dimen/spacing_xmedium"
android:orientation="horizontal">
<ImageButton
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="@android:color/transparent"
android:tint="@color/colorPrimary"
app:srcCompat="@drawable/ic_email" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="0dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:gravity="center_vertical"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="my.email@example.com"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_90" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Personal"
android:textAppearance="@style/TextAppearance.AppCompat.Small"
android:textColor="@color/grey_40" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:gravity="center_vertical"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="my.email@example.com"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_90" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Work"
android:textAppearance="@style/TextAppearance.AppCompat.Small"
android:textColor="@color/grey_40" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/spacing_large"
android:layout_marginTop="@dimen/spacing_large"
android:orientation="horizontal">
<View
android:layout_width="?attr/actionBarSize"
android:layout_height="0dp" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="0dp" />
<View
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/grey_10" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="@dimen/spacing_xmedium"
android:layout_marginTop="@dimen/spacing_xmedium"
android:orientation="horizontal">
<ImageButton
android:layout_width="?attr/actionBarSize"
android:layout_height="?attr/actionBarSize"
android:background="@android:color/transparent"
android:tint="@color/colorPrimary"
app:srcCompat="@drawable/ic_location" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="0dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:minHeight="?attr/actionBarSize"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="2000 Main Street \nSan Francisco, CA 94112"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_90" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Personal"
android:textAppearance="@style/TextAppearance.AppCompat.Small"
android:textColor="@color/grey_40" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/spacing_mlarge"
android:gravity="center_vertical"
android:minHeight="?attr/actionBarSize"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="1600 Amphitheatre Pkwy \nMountain View, CA 94043"
android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
android:textColor="@color/grey_90" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Work"
android:textAppearance="@style/TextAppearance.AppCompat.Small"
android:textColor="@color/grey_40" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<View
android:id="@+id/lyt_spacer"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</LinearLayout>
item_people_left.xml
<?xml version="1.0" encoding="utf-8"?>
<com.balysv.materialripple.MaterialRippleLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/lyt_parent"
style="@style/RippleStyleBlack"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@android:color/white"
android:focusable="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal">
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="wrap_content" />
<ImageView
android:id="@+id/image"
android:layout_width="45dp"
android:layout_height="45dp"
android:background="@android:color/transparent"
android:src="@drawable/photo_female_1" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="wrap_content" />
<TextView
android:id="@+id/name"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Item Title"
android:textAppearance="@style/TextAppearance.AppCompat.Medium"
android:textColor="@color/grey_80" />
<View
android:layout_width="@dimen/spacing_large"
android:layout_height="wrap_content" />
</LinearLayout>
</com.balysv.materialripple.MaterialRippleLayout>
toolbar.xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
app:contentInsetStartWithNavigation="0dp"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
menu_basic.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_search"
android:icon="@drawable/ic_search"
android:orderInCategory="100"
android:title="Search"
app:showAsAction="always" />
<item
android:id="@+id/action_settings"
android:orderInCategory="100"
android:title="Settings"
app:showAsAction="never" />
</menu>
menu_people_more.xml
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_preview"
android:orderInCategory="100"
android:title="Preview"
app:showAsAction="never" />
<item
android:id="@+id/action_share"
android:orderInCategory="100"
android:title="Share"
app:showAsAction="never" />
<item
android:id="@+id/action_get_link"
android:orderInCategory="100"
android:title="Get link"
app:showAsAction="never" />
</menu>
array.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<integer-array name="people_images">
<item>@drawable/photo_male_1</item>
<item>@drawable/photo_male_2</item>
<item>@drawable/photo_female_1</item>
<item>@drawable/photo_female_2</item>
<item>@drawable/photo_male_3</item>
<item>@drawable/photo_female_3</item>
<item>@drawable/photo_male_4</item>
<item>@drawable/photo_female_4</item>
<item>@drawable/photo_female_5</item>
<item>@drawable/photo_male_5</item>
<item>@drawable/photo_female_6</item>
<item>@drawable/photo_male_6</item>
<item>@drawable/photo_male_7</item>
<item>@drawable/photo_female_7</item>
<item>@drawable/photo_female_8</item>
</integer-array>
<string-array name="people_names">
<item>Anderson Thomas</item>
<item>Adams Green</item>
<item>Laura Michelle</item>
<item>Betty L</item>
<item>Miller Wilson</item>
<item>Garcia Lewis</item>
<item>Roberts Turner</item>
<item>Mary Jackson</item>
<item>Sarah Scott</item>
<item>Kevin John</item>
<item>Elizabeth</item>
<item>Evans Collins</item>
<item>Roberts</item>
<item>Betty C</item>
<item>Susan Lee</item>
</string-array>
</resources>
colors.xml
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="colorPrimary">#1976D2</color>
<color name="colorPrimaryDark">#1565C0</color>
<color name="colorPrimaryLight">#1E88E5</color>
<color name="colorAccent">#FF4081</color>
<color name="colorAccentDark">#F50057</color>
<color name="colorAccentLight">#FF80AB</color>
<color name="grey_3">#f7f7f7</color>
<color name="grey_5">#f2f2f2</color>
<color name="grey_10">#e6e6e6</color>
<color name="grey_20">#cccccc</color>
<color name="grey_40">#999999</color>
<color name="grey_60">#666666</color>
<color name="grey_80">#37474F</color>
<color name="grey_90">#263238</color>
<color name="grey_95">#1a1a1a</color>
<color name="grey_100_">#0d0d0d</color>
<color name="green_50">#E8F5E9</color>
<color name="green_100">#C8E6C9</color>
<color name="green_200">#A5D6A7</color>
<color name="green_300">#81C784</color>
<color name="green_400">#66BB6A</color>
<color name="green_500">#4CAF50</color>
<color name="green_600">#43A047</color>
<color name="green_700">#388E3C</color>
<color name="green_800">#2E7D32</color>
<color name="green_900">#1B5E20</color>
<color name="green_A100">#B9F6CA</color>
<color name="green_A200">#69F0AE</color>
<color name="green_A400">#00E676</color>
<color name="green_A700">#00C853</color>
</resources>
dimens.xml
<resources>
<!--genaral spacing-->
<dimen name="spacing_xsmall">2dp</dimen>
<dimen name="spacing_small">3dp</dimen>
<dimen name="spacing_medium">5dp</dimen>
<dimen name="spacing_xmedium">7dp</dimen>
<dimen name="spacing_middle">10dp</dimen>
<dimen name="spacing_large">15dp</dimen>
<dimen name="spacing_smlarge">18dp</dimen>
<dimen name="spacing_mlarge">20dp</dimen>
<dimen name="spacing_mxlarge">25dp</dimen>
<dimen name="spacing_xlarge">35dp</dimen>
<dimen name="spacing_xmlarge">40dp</dimen>
<dimen name="spacing_xxlarge">50dp</dimen>
<dimen name="spacing_xxxlarge">55dp</dimen>
<dimen name="appbar_padding_top">8dp</dimen>
</resources>
strings-data.xml
<resources>
<string name="middle_lorem_ipsum">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam efficitur ipsum in placerat molestie. Fusce quis mauris a enim sollicitudin</string>
</resources>
strings.xml
<resources>
<string name="app_name">BottomSheetBasic</string>
<string name="bottom_sheet_behavior" translatable="false">android.support.design.widget.BottomSheetBehavior</string>
</resources>
styles.xml
<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
<!--style for ripple library-->
<style name="RippleStyleWhite">
<item name="mrl_rippleOverlay">true</item>
<item name="mrl_rippleColor">#80FFFFFF</item>
<item name="mrl_rippleHover">true</item>
<item name="mrl_rippleAlpha">0.2</item>
</style>
<style name="RippleStyleBlack" parent="RippleStyleWhite">
<item name="mrl_rippleColor">#8096989A</item>
</style>
<style name="Button.Primary" parent="@style/Widget.AppCompat.Button.Colored">
<item name="colorButtonNormal">@color/colorPrimary</item>
<item name="android:textColor">@android:color/white</item>
</style>
</resources>
4. Adapter
AdapterPeopleLeft
package full.bottomsheet.fyprojects.com.bottomsheetfull.adapter;
import android.content.Context;
import android.support.v7.widget.PopupMenu;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.MenuItem;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.ArrayList;
import java.util.List;
import full.bottomsheet.fyprojects.com.bottomsheetfull.R;
import full.bottomsheet.fyprojects.com.bottomsheetfull.model.People;
import full.bottomsheet.fyprojects.com.bottomsheetfull.utils.Tools;
public class AdapterPeopleLeft extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
private List<People> items = new ArrayList<>();
private Context ctx;
private OnItemClickListener onItemClickListener;
private OnMoreButtonClickListener onMoreButtonClickListener;
public void setOnItemClickListener(OnItemClickListener onItemClickListener) {
this.onItemClickListener = onItemClickListener;
}
public void setOnMoreButtonClickListener(final OnMoreButtonClickListener onMoreButtonClickListener) {
this.onMoreButtonClickListener = onMoreButtonClickListener;
}
public AdapterPeopleLeft(Context context, List<People> items) {
this.items = items;
ctx = context;
}
public class ViewHolder extends RecyclerView.ViewHolder {
// each data item is just a string in this case
public ImageView image;
public TextView name;
public View lyt_parent;
public ViewHolder(View v) {
super(v);
image = (ImageView) v.findViewById(R.id.image);
name = (TextView) v.findViewById(R.id.name);
lyt_parent = (View) v.findViewById(R.id.lyt_parent);
}
}
@Override
public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
RecyclerView.ViewHolder vh;
View v = LayoutInflater.from(parent.getContext()).inflate(R.layout.item_people_left, parent, false);
vh = new ViewHolder(v);
return vh;
}
// Replace the contents of a view (invoked by the layout manager)
@Override
public void onBindViewHolder(RecyclerView.ViewHolder holder, final int position) {
if (holder instanceof ViewHolder) {
ViewHolder view = (ViewHolder) holder;
final People o = items.get(position);
view.name.setText(o.name);
Tools.displayImageRound(ctx, view.image, o.image);
view.lyt_parent.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View view) {
if (onItemClickListener == null) return;
onItemClickListener.onItemClick(view, o, position);
}
});
}
}
private void onMoreButtonClick(final View view, final People people) {
PopupMenu popupMenu = new PopupMenu(ctx, view);
popupMenu.setOnMenuItemClickListener(new PopupMenu.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
onMoreButtonClickListener.onItemClick(view, people, item);
return true;
}
});
popupMenu.inflate(R.menu.menu_people_more);
popupMenu.show();
}
@Override
public int getItemCount() {
return items.size();
}
public People getItem(int position) {
return items.get(position);
}
public interface OnItemClickListener {
void onItemClick(View view, People obj, int pos);
}
public interface OnMoreButtonClickListener {
void onItemClick(View view, People obj, MenuItem item);
}
}
5. Data
DataGenerator
package full.bottomsheet.fyprojects.com.bottomsheetfull.data;
import android.content.Context;
import android.content.res.TypedArray;
import java.util.ArrayList;
import java.util.Collections;
import java.util.List;
import full.bottomsheet.fyprojects.com.bottomsheetfull.R;
import full.bottomsheet.fyprojects.com.bottomsheetfull.model.People;
import full.bottomsheet.fyprojects.com.bottomsheetfull.utils.Tools;
@SuppressWarnings("ResourceType")
public class DataGenerator {
/**
* Generate dummy data people
*
* @param ctx android context
* @return list of object
*/
public static List<People> getPeopleData(Context ctx) {
List<People> items = new ArrayList<>();
TypedArray drw_arr = ctx.getResources().obtainTypedArray(R.array.people_images);
String name_arr[] = ctx.getResources().getStringArray(R.array.people_names);
for (int i = 0; i < drw_arr.length(); i++) {
People obj = new People();
obj.image = drw_arr.getResourceId(i, -1);
obj.name = name_arr[i];
obj.email = Tools.getEmailFromName(obj.name);
obj.imageDrw = ctx.getResources().getDrawable(obj.image);
items.add(obj);
}
Collections.shuffle(items);
return items;
}
}
6.Fragment
FragmentBottomSheetDialogFull
package full.bottomsheet.fyprojects.com.bottomsheetfull.fragment;
import android.app.Dialog;
import android.content.res.TypedArray;
import android.os.Bundle;
import android.support.annotation.NonNull;
import android.support.design.widget.AppBarLayout;
import android.support.design.widget.BottomSheetBehavior;
import android.support.design.widget.BottomSheetDialog;
import android.support.design.widget.BottomSheetDialogFragment;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageButton;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;
import full.bottomsheet.fyprojects.com.bottomsheetfull.R;
import full.bottomsheet.fyprojects.com.bottomsheetfull.model.People;
import full.bottomsheet.fyprojects.com.bottomsheetfull.utils.Tools;
public class FragmentBottomSheetDialogFull extends BottomSheetDialogFragment {
private BottomSheetBehavior mBehavior;
private AppBarLayout app_bar_layout;
private LinearLayout lyt_profile;
private People people;
public void setPeople(People people) {
this.people = people;
}
@NonNull
@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
final BottomSheetDialog dialog = (BottomSheetDialog) super.onCreateDialog(savedInstanceState);
final View view = View.inflate(getContext(), R.layout.fragment_bottom_sheet_dialog_full, null);
dialog.setContentView(view);
mBehavior = BottomSheetBehavior.from((View) view.getParent());
mBehavior.setPeekHeight(BottomSheetBehavior.PEEK_HEIGHT_AUTO);
app_bar_layout = (AppBarLayout) view.findViewById(R.id.app_bar_layout);
lyt_profile = (LinearLayout) view.findViewById(R.id.lyt_profile);
// set data to view
Tools.displayImageRound(getActivity(), (ImageView) view.findViewById(R.id.image), people.image);
((TextView) view.findViewById(R.id.name)).setText(people.name);
((TextView) view.findViewById(R.id.name_toolbar)).setText(people.name);
((View) view.findViewById(R.id.lyt_spacer)).setMinimumHeight(Tools.getScreenHeight() / 2);
hideView(app_bar_layout);
mBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
@Override
public void onStateChanged(@NonNull View bottomSheet, int newState) {
if (BottomSheetBehavior.STATE_EXPANDED == newState) {
showView(app_bar_layout, getActionBarSize());
hideView(lyt_profile);
}
if (BottomSheetBehavior.STATE_COLLAPSED == newState) {
hideView(app_bar_layout);
showView(lyt_profile, getActionBarSize());
}
if (BottomSheetBehavior.STATE_HIDDEN == newState) {
dismiss();
}
}
@Override
public void onSlide(@NonNull View bottomSheet, float slideOffset) {
}
});
((ImageButton) view.findViewById(R.id.bt_close)).setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
dismiss();
}
});
return dialog;
}
@Override
public void onStart() {
super.onStart();
mBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
}
private void hideView(View view) {
ViewGroup.LayoutParams params = view.getLayoutParams();
params.height = 0;
view.setLayoutParams(params);
}
private void showView(View view, int size) {
ViewGroup.LayoutParams params = view.getLayoutParams();
params.height = size;
view.setLayoutParams(params);
}
private int getActionBarSize() {
final TypedArray styledAttributes = getContext().getTheme().obtainStyledAttributes(new int[]{android.R.attr.actionBarSize});
int size = (int) styledAttributes.getDimension(0, 0);
return size;
}
}
7. Model
People
package basic.bottomsheet.fyprojects.com.bottomsheetbasic.model;
import android.graphics.drawable.Drawable;
public class People {
public int image;
public Drawable imageDrw;
public String name;
public String email;
public boolean section = false;
public People() {
}
public People(String name, boolean section) {
this.name = name;
this.section = section;
}
}
7. Utils
Tools
package full.bottomsheet.fyprojects.com.bottomsheetfull.utils;
import android.app.Activity;
import android.content.Context;
import android.content.res.Resources;
import android.graphics.Bitmap;
import android.os.Build;
import android.support.annotation.DrawableRes;
import android.support.v4.graphics.drawable.RoundedBitmapDrawable;
import android.support.v4.graphics.drawable.RoundedBitmapDrawableFactory;
import android.view.Window;
import android.view.WindowManager;
import android.widget.ImageView;
import com.bumptech.glide.Glide;
import com.bumptech.glide.request.target.BitmapImageViewTarget;
import full.bottomsheet.fyprojects.com.bottomsheetfull.R;
public class Tools {
public static void displayImageRound(final Context ctx, final ImageView img, @DrawableRes int drawable) {
try {
Glide.with(ctx).load(drawable).asBitmap().centerCrop().into(new BitmapImageViewTarget(img) {
@Override
protected void setResource(Bitmap resource) {
RoundedBitmapDrawable circularBitmapDrawable = RoundedBitmapDrawableFactory.create(ctx.getResources(), resource);
circularBitmapDrawable.setCircular(true);
img.setImageDrawable(circularBitmapDrawable);
}
});
} catch (Exception e) {
}
}
public static void setSystemBarColor(Activity act) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
Window window = act.getWindow();
window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);
window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);
window.setStatusBarColor(act.getResources().getColor(R.color.colorPrimaryDark));
}
}
public static String getEmailFromName(String name) {
if (name != null && !name.equals("")) {
String email = name.replaceAll(" ", ".").toLowerCase().concat("@mail.com");
return email;
}
return name;
}
public static int getScreenHeight() {
return Resources.getSystem().getDisplayMetrics().heightPixels;
}
}
8. Activity
MainActivity
package full.bottomsheet.fyprojects.com.bottomsheetfull;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.View;
import android.widget.Toast;
import full.bottomsheet.fyprojects.com.bottomsheetfull.adapter.AdapterPeopleLeft;
import full.bottomsheet.fyprojects.com.bottomsheetfull.data.DataGenerator;
import full.bottomsheet.fyprojects.com.bottomsheetfull.fragment.FragmentBottomSheetDialogFull;
import full.bottomsheet.fyprojects.com.bottomsheetfull.model.People;
import full.bottomsheet.fyprojects.com.bottomsheetfull.utils.Tools;
public class MainActivity extends AppCompatActivity {
private RecyclerView recyclerView;
private AdapterPeopleLeft adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initComponent();
initToolbar();
Toast.makeText(this, "Swipe up bottom sheet", Toast.LENGTH_SHORT).show();
}
private void initComponent() {
recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
recyclerView.setLayoutManager(new LinearLayoutManager(this));
//set data and list adapter
adapter = new AdapterPeopleLeft(this, DataGenerator.getPeopleData(this));
recyclerView.setAdapter(adapter);
adapter.setOnItemClickListener(new AdapterPeopleLeft.OnItemClickListener() {
@Override
public void onItemClick(View view, People obj, int pos) {
FragmentBottomSheetDialogFull fragment = new FragmentBottomSheetDialogFull();
fragment.setPeople(obj);
fragment.show(getSupportFragmentManager(), fragment.getTag());
}
});
// display first sheet
FragmentBottomSheetDialogFull fragment = new FragmentBottomSheetDialogFull();
fragment.setPeople(adapter.getItem(0));
fragment.show(getSupportFragmentManager(), fragment.getTag());
}
private void initToolbar() {
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setNavigationIcon(R.drawable.ic_menu);
setSupportActionBar(toolbar);
ActionBar actionBar = getSupportActionBar();
actionBar.setTitle("Full");
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
Tools.setSystemBarColor(this);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_basic, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId() == android.R.id.home) {
finish();
} else {
Toast.makeText(getApplicationContext(), item.getTitle(), Toast.LENGTH_SHORT).show();
}
return super.onOptionsItemSelected(item);
}
}
