Dachshund Tab Layout
Introduction
Boosted Android Tab Layout with custom animated indicators including "Dachshund" animation inspired by this.
Sample
Available Animated Indicators
| Indicator | Example | Custom behavior |
|---|---|---|
| DachshundIndicator |  |
|
| PointMoveIndicator |  |
setInterpolator(TimeInterpolator interpolator) |
| LineMoveIndicator |  |
setEdgeRadius(int edgeRadius) |
| PointFadeIndicator |  |
|
| LineFadeIndicator |  |
setEdgeRadius(int edgeRadius) |
Installation
Step 1
Add the JitPack repository to your build file
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
Step 2
Add the dependency
dependencies {
compile 'com.github.Andy671:Dachshund-Tab-Layout:v0.3.3'
}
Usage
DachshundTabLayout is a subclass of TabLayout, so usage is pretty similar. The most of the original methods should work without any problems. See sample and source code for more info.
Add DachshundTabLayout to xml (after the Toolbar in the AppBarLayout), if you have TabLayout simply replace it:
<android.support.design.widget.AppBarLayout
...
<android.support.v7.widget.Toolbar
.../>
<com.kekstudio.dachshundtablayout.DachshundTabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
Setup it with a ViewPager:
DachshundTabLayout tabLayout = (DachshundTabLayout) findViewById(R.id.tab_layout);
tabLayout.setupWithViewPager(yourViewPager);
If you want to change animated indicator (see Available Animated Indicators):
//AvailableAnimatedIndicator - change it with available animated indicator
AvailableAnimatedIndicator indicator = new AvailableAnimatedIndicator(tabLayout);
tabLayout.setAnimatedIndicator(indicator);
Center align
In v0.3.2 I've added ddCenterAlign parameter. You can use it when you want to center the tabs in scrollable tabMode. Working behavior from Stackoverflow question.
<com.kekstudio.dachshundtablayout.DachshundTabLayout
...
custom:tabMode="scrollable"
custom:ddCenterAlign="true"/>
Creating custom AnimatedIndicator
If you want to create your own custom AnimatedIndicator - you can implement AnimatedIndicatorInterface and if you want to use animators - AnimatorUpdateListener (See JavaDoc of AnimatedIndicatorInterface for more info):
public class CustomIndicator implements AnimatedIndicatorInterface, ValueAnimator.AnimatorUpdateListener {
private DachshundTabLayout dachshundTabLayout;
public CustomIndicator(DachshundTabLayout dachshundTabLayout){
this.dachshundTabLayout = dachshundTabLayout;
//here set-up your Animators, Paints etc.
}
@Override
public void onAnimationUpdate(ValueAnimator animator) {
// when animator updates - invalidate your canvas, and draw what you want.
}
@Override
public void setSelectedTabIndicatorColor(@ColorInt int color) {
// customization of color
}
@Override
public void setSelectedTabIndicatorHeight(int height) {
// customization of height
}
@Override
public void setIntValues(int startXLeft, int endXLeft,
int startXCenter, int endXCenter,
int startXRight, int endXRight){
// X-positions of the target and current tabs
}
@Override
public void setCurrentPlayTime(long currentPlayTime) {
// current play time of the animation
}
@Override
public void draw(Canvas canvas) {
//Make your draw calls here
}
@Override
public long getDuration() {
return DEFAULT_DURATION;
}
}
XML Attributes
| Attribute | Type | Default |
|---|---|---|
| ddIndicatorHeight | dimension | 6dp |
| ddIndicatorColor | color | Color.WHITE |
| ddAnimatedIndicator | enum [dachshund, pointMove, lineMove, pointFade, lineFade] | dachshund |
Contribution
- Feel free to fork the repo, make pull requests or fix existing bug
- Feel free to open issues if you find some bug or unexpected behaviour
75 May 21, 2022
95 Nov 15, 2022
716 Dec 25, 2022
516 Nov 25, 2022
615 Nov 14, 2022
2.7k Jan 2, 2023
1k Dec 14, 2022
833 Dec 30, 2022
318 Dec 7, 2022
116 Nov 25, 2022
348 Nov 16, 2022
12 Aug 12, 2021
696 Dec 28, 2022
0 Jan 2, 2022
3 Feb 17, 2022
2 Jun 24, 2022
33 Dec 24, 2022
12 Jul 6, 2022
866 Dec 29, 2022