mirror of
https://github.com/MatomoCamp/matomocamp-companion-android.git
synced 2024-09-19 16:13:46 +02:00
Improved SlidingTabLayout for simpler code and better respect of material design guidelines
This commit is contained in:
parent
e33961eade
commit
e4dfbc67c1
7 changed files with 76 additions and 102 deletions
|
@ -1,6 +1,6 @@
|
|||
/*
|
||||
* Copyright 2014 Chris Banes
|
||||
* Copyright 2015 Christophe Beyls
|
||||
* Copyright 2016 Christophe Beyls
|
||||
*
|
||||
* Licensed under the Apache License, Version 2.0 (the "License");
|
||||
* you may not use this file except in compliance with the License.
|
||||
|
@ -22,20 +22,18 @@ import android.content.res.ColorStateList;
|
|||
import android.content.res.TypedArray;
|
||||
import android.graphics.Typeface;
|
||||
import android.os.Build;
|
||||
import android.support.annotation.ColorInt;
|
||||
import android.support.annotation.IdRes;
|
||||
import android.support.annotation.LayoutRes;
|
||||
import android.support.v4.view.PagerAdapter;
|
||||
import android.support.v4.view.ViewPager;
|
||||
import android.util.AttributeSet;
|
||||
import android.util.TypedValue;
|
||||
import android.view.Gravity;
|
||||
import android.view.LayoutInflater;
|
||||
import android.view.View;
|
||||
import android.view.ViewGroup;
|
||||
import android.widget.HorizontalScrollView;
|
||||
import android.widget.LinearLayout;
|
||||
import android.widget.TextView;
|
||||
|
||||
import java.util.Locale;
|
||||
|
||||
import be.digitalia.fosdem.R;
|
||||
|
||||
/**
|
||||
|
@ -50,9 +48,7 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
|
||||
}
|
||||
|
||||
private static final int TITLE_OFFSET_DIPS = 24;
|
||||
private static final int TAB_VIEW_PADDING_DIPS = 16;
|
||||
private static final int TAB_VIEW_TEXT_SIZE_SP = 14;
|
||||
private static final int[][] TAB_COLOR_STATES = new int[][]{SELECTED_STATE_SET, EMPTY_STATE_SET};
|
||||
|
||||
private int mTitleOffset;
|
||||
|
||||
|
@ -61,7 +57,6 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
private boolean mDistributeEvenly;
|
||||
|
||||
private ColorStateList mTextColor;
|
||||
private int mItemBackground;
|
||||
|
||||
private ViewPager mViewPager;
|
||||
|
||||
|
@ -85,44 +80,27 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
// Make sure that the Tab Strips fills this View
|
||||
setFillViewport(true);
|
||||
|
||||
mTitleOffset = (int) (TITLE_OFFSET_DIPS * getResources().getDisplayMetrics().density);
|
||||
|
||||
mTabStrip = new SlidingTabStrip(context);
|
||||
addView(mTabStrip, LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
|
||||
|
||||
TypedValue outValue = new TypedValue();
|
||||
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SlidingTabLayout);
|
||||
TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SlidingTabLayout,
|
||||
defStyle, R.style.SlidingTabLayout);
|
||||
|
||||
if (a.hasValue(R.styleable.SlidingTabLayout_indicatorHeight)) {
|
||||
mTabStrip.setSelectedIndicatorHeight(
|
||||
a.getDimensionPixelSize(R.styleable.SlidingTabLayout_indicatorHeight, 0));
|
||||
mTabStrip.setSelectedIndicatorHeight(a.getDimensionPixelSize(R.styleable.SlidingTabLayout_indicatorHeight, 0));
|
||||
mTabStrip.setSelectedIndicatorColor(a.getColor(R.styleable.SlidingTabLayout_indicatorColor, 0));
|
||||
mTextColor = a.getColorStateList(R.styleable.SlidingTabLayout_textColor);
|
||||
if ((mTextColor != null) && a.hasValue(R.styleable.SlidingTabLayout_selectedTextColor)) {
|
||||
setTabTextColors(mTextColor.getDefaultColor(), a.getColor(R.styleable.SlidingTabLayout_selectedTextColor, 0));
|
||||
}
|
||||
|
||||
if (a.hasValue(R.styleable.SlidingTabLayout_indicatorColor)) {
|
||||
mTabStrip.setSelectedIndicatorColor(
|
||||
a.getColor(R.styleable.SlidingTabLayout_indicatorColor, 0));
|
||||
}
|
||||
|
||||
if (a.hasValue(R.styleable.SlidingTabLayout_textColor)) {
|
||||
setTextColor(a.getColorStateList(R.styleable.SlidingTabLayout_textColor));
|
||||
} else {
|
||||
context.getTheme().resolveAttribute(android.R.attr.colorForeground, outValue, true);
|
||||
setTextColor(outValue.data);
|
||||
}
|
||||
|
||||
mTitleOffset = a.getDimensionPixelSize(R.styleable.SlidingTabLayout_contentInsetStart,
|
||||
mTitleOffset);
|
||||
|
||||
mTabStrip.setPadding(mTitleOffset, 0, 0, 0);
|
||||
|
||||
mDistributeEvenly = a.getBoolean(R.styleable.SlidingTabLayout_distributeEvenly, false);
|
||||
setContentInsetStart(a.getDimensionPixelSize(R.styleable.SlidingTabLayout_contentInsetStart, 0));
|
||||
setDistributeEvenly(a.getBoolean(R.styleable.SlidingTabLayout_distributeEvenly, false));
|
||||
|
||||
a.recycle();
|
||||
}
|
||||
|
||||
// Use the Support Library Theme's
|
||||
// selectableItemBackground to ensure that the View has a pressed state
|
||||
context.getTheme().resolveAttribute(R.attr.selectableItemBackground, outValue, true);
|
||||
mItemBackground = outValue.resourceId;
|
||||
public void setContentInsetStart(int offset) {
|
||||
mTitleOffset = offset;
|
||||
mTabStrip.setPadding(offset, 0, 0, 0);
|
||||
}
|
||||
|
||||
public void setDistributeEvenly(boolean distributeEvenly) {
|
||||
|
@ -133,16 +111,25 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
* Sets the color to be used for indicating the selected tab.
|
||||
* This will override the style color.
|
||||
*/
|
||||
public void setSelectedIndicatorColor(int color) {
|
||||
public void setSelectedTabIndicatorColor(@ColorInt int color) {
|
||||
mTabStrip.setSelectedIndicatorColor(color);
|
||||
}
|
||||
|
||||
public void setTextColor(ColorStateList color) {
|
||||
public void setSelectedTabIndicatorHeight(int height) {
|
||||
mTabStrip.setSelectedIndicatorHeight(height);
|
||||
}
|
||||
|
||||
public void setTabTextColors(ColorStateList color) {
|
||||
mTextColor = color;
|
||||
}
|
||||
|
||||
public void setTextColor(int color) {
|
||||
setTextColor(ColorStateList.valueOf(color));
|
||||
public void setTabTextColors(@ColorInt int normalColor, @ColorInt int selectedColor) {
|
||||
mTextColor = createColorStateList(normalColor, selectedColor);
|
||||
}
|
||||
|
||||
private static ColorStateList createColorStateList(int defaultColor, int selectedColor) {
|
||||
final int[] colors = new int[]{selectedColor, defaultColor};
|
||||
return new ColorStateList(TAB_COLOR_STATES, colors);
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -151,7 +138,7 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
* @param layoutResId Layout id to be inflated
|
||||
* @param textViewId id of the {@link TextView} in the inflated view
|
||||
*/
|
||||
public void setCustomTabView(int layoutResId, int textViewId) {
|
||||
public void setCustomTabView(@LayoutRes int layoutResId, @IdRes int textViewId) {
|
||||
mTabViewLayoutId = layoutResId;
|
||||
mTabViewTextViewId = textViewId;
|
||||
}
|
||||
|
@ -179,38 +166,11 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Create a default view to be used for tabs. This is called if a custom tab view is not set via
|
||||
* {@link #setCustomTabView(int, int)}.
|
||||
*/
|
||||
protected TextView createDefaultTabView(Context context) {
|
||||
TextView textView = new TextView(context);
|
||||
textView.setGravity(Gravity.CENTER);
|
||||
textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, TAB_VIEW_TEXT_SIZE_SP);
|
||||
textView.setTypeface(Typeface.DEFAULT_BOLD);
|
||||
textView.setTextColor(mTextColor);
|
||||
|
||||
if (mItemBackground != 0) {
|
||||
textView.setBackgroundResource(mItemBackground);
|
||||
}
|
||||
|
||||
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
|
||||
// If we're running on ICS or newer, enable all-caps to match the Action Bar tab style
|
||||
textView.setAllCaps(true);
|
||||
}
|
||||
|
||||
int padding = (int) (TAB_VIEW_PADDING_DIPS * getResources().getDisplayMetrics().density);
|
||||
textView.setPadding(padding, padding, padding, padding);
|
||||
|
||||
textView.setLayoutParams(new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT,
|
||||
ViewGroup.LayoutParams.MATCH_PARENT));
|
||||
|
||||
return textView;
|
||||
}
|
||||
|
||||
private void populateTabStrip() {
|
||||
final PagerAdapter adapter = mViewPager.getAdapter();
|
||||
final View.OnClickListener tabClickListener = new TabClickListener();
|
||||
final LayoutInflater inflater = LayoutInflater.from(getContext());
|
||||
final int currentItem = mViewPager.getCurrentItem();
|
||||
|
||||
for (int i = 0; i < adapter.getCount(); i++) {
|
||||
View tabView;
|
||||
|
@ -218,15 +178,22 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
|
||||
if (mTabViewLayoutId != 0) {
|
||||
// If there is a custom tab view layout id set, try and inflate it
|
||||
tabView = LayoutInflater.from(getContext()).inflate(mTabViewLayoutId, mTabStrip,
|
||||
false);
|
||||
tabView = inflater.inflate(mTabViewLayoutId, mTabStrip, false);
|
||||
tabTitleView = (TextView) tabView.findViewById(mTabViewTextViewId);
|
||||
if (tabTitleView == null) {
|
||||
tabTitleView = (TextView) tabView;
|
||||
}
|
||||
} else {
|
||||
tabTitleView = createDefaultTabView(getContext());
|
||||
tabView = tabTitleView;
|
||||
// Inflate our default tab layout
|
||||
tabView = inflater.inflate(R.layout.widget_sliding_tab_layout_text, mTabStrip, false);
|
||||
tabTitleView = (TextView) tabView;
|
||||
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
|
||||
// Emulate Roboto Medium in previous Android versions
|
||||
tabTitleView.setTypeface(Typeface.DEFAULT_BOLD);
|
||||
}
|
||||
}
|
||||
if (mTextColor != null) {
|
||||
tabTitleView.setTextColor(mTextColor);
|
||||
}
|
||||
|
||||
if (mDistributeEvenly) {
|
||||
|
@ -235,17 +202,12 @@ public class SlidingTabLayout extends HorizontalScrollView {
|
|||
lp.weight = 1;
|
||||
}
|
||||
|
||||
CharSequence tabText = adapter.getPageTitle(i);
|
||||
if (Build.VERSION.SDK_INT < Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
|
||||
// Emulate allCaps
|
||||
tabText = tabText.toString().toUpperCase(Locale.getDefault());
|
||||
}
|
||||
tabTitleView.setText(tabText);
|
||||
tabTitleView.setText(adapter.getPageTitle(i));
|
||||
tabView.setFocusable(true);
|
||||
tabView.setOnClickListener(tabClickListener);
|
||||
|
||||
mTabStrip.addView(tabView);
|
||||
if (i == mViewPager.getCurrentItem()) {
|
||||
if (i == currentItem) {
|
||||
tabView.setSelected(true);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -19,14 +19,13 @@ package com.example.android.common.view;
|
|||
import android.content.Context;
|
||||
import android.graphics.Canvas;
|
||||
import android.graphics.Paint;
|
||||
import android.support.annotation.ColorInt;
|
||||
import android.util.AttributeSet;
|
||||
import android.view.View;
|
||||
import android.widget.LinearLayout;
|
||||
|
||||
class SlidingTabStrip extends LinearLayout {
|
||||
|
||||
private static final int DEFAULT_INDICATOR_HEIGHT_DIPS = 3;
|
||||
|
||||
private int mSelectedIndicatorHeight;
|
||||
private final Paint mSelectedIndicatorPaint;
|
||||
|
||||
|
@ -40,13 +39,10 @@ class SlidingTabStrip extends LinearLayout {
|
|||
SlidingTabStrip(Context context, AttributeSet attrs) {
|
||||
super(context, attrs);
|
||||
setWillNotDraw(false);
|
||||
|
||||
final float density = getResources().getDisplayMetrics().density;
|
||||
mSelectedIndicatorHeight = (int) (DEFAULT_INDICATOR_HEIGHT_DIPS * density);
|
||||
mSelectedIndicatorPaint = new Paint();
|
||||
}
|
||||
|
||||
void setSelectedIndicatorColor(int color) {
|
||||
void setSelectedIndicatorColor(@ColorInt int color) {
|
||||
mSelectedIndicatorPaint.setColor(color);
|
||||
invalidate();
|
||||
}
|
||||
|
|
|
@ -1,7 +0,0 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<selector xmlns:android="http://schemas.android.com/apk/res/android">
|
||||
<item android:color="#fff" android:state_selected="true"/>
|
||||
<item android:color="#fff" android:state_pressed="true"/>
|
||||
<!-- 60% brightness like mentioned in Material Design guidelines -->
|
||||
<item android:color="#9fff"/>
|
||||
</selector>
|
10
app/src/main/res/layout/widget_sliding_tab_layout_text.xml
Normal file
10
app/src/main/res/layout/widget_sliding_tab_layout_text.xml
Normal file
|
@ -0,0 +1,10 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<TextView style="@style/TextAppearance.AppCompat.Button"
|
||||
xmlns:android="http://schemas.android.com/apk/res/android"
|
||||
android:layout_width="wrap_content"
|
||||
android:layout_height="48dp"
|
||||
android:background="?attr/selectableItemBackground"
|
||||
android:gravity="center"
|
||||
android:minWidth="72dp"
|
||||
android:padding="12dp"
|
||||
android:textAppearance="@style/TextAppearance.AppCompat.Button"/>
|
|
@ -6,8 +6,9 @@
|
|||
|
||||
<declare-styleable name="SlidingTabLayout">
|
||||
<attr name="indicatorColor" format="color"/>
|
||||
<attr name="indicatorHeight" format="reference|dimension"/>
|
||||
<attr name="textColor" format="color"/>
|
||||
<attr name="indicatorHeight" format="dimension"/>
|
||||
<attr name="textColor" format="color|reference"/>
|
||||
<attr name="selectedTextColor" format="color"/>
|
||||
<attr name="contentInsetStart"/>
|
||||
<attr name="distributeEvenly" format="boolean"/>
|
||||
</declare-styleable>
|
||||
|
|
13
app/src/main/res/values/defaults.xml
Normal file
13
app/src/main/res/values/defaults.xml
Normal file
|
@ -0,0 +1,13 @@
|
|||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<resources>
|
||||
|
||||
<style name="SlidingTabLayout" parent="android:Widget">
|
||||
<item name="indicatorColor">?attr/colorAccent</item>
|
||||
<item name="indicatorHeight">2dp</item>
|
||||
<item name="textColor">?android:textColorSecondary</item>
|
||||
<item name="selectedTextColor">?android:textColorPrimary</item>
|
||||
<item name="contentInsetStart">24dp</item>
|
||||
<item name="distributeEvenly">false</item>
|
||||
</style>
|
||||
|
||||
</resources>
|
|
@ -76,11 +76,10 @@
|
|||
<item name="android:drawablePadding">@dimen/main_menu_drawable_padding</item>
|
||||
</style>
|
||||
|
||||
<style name="SlidingTabs">
|
||||
<style name="SlidingTabs" parent="SlidingTabLayout">
|
||||
<item name="android:theme">@style/ThemeOverlay.AppCompat.Dark</item>
|
||||
<item name="android:background">?attr/colorPrimary</item>
|
||||
<item name="indicatorColor">@android:color/white</item>
|
||||
<item name="textColor">@color/tab_text</item>
|
||||
</style>
|
||||
|
||||
<style name="FloatingActionButtonBase">
|
||||
|
|
Loading…
Reference in a new issue