All Projects → zjw-swun → Apporder

zjw-swun / Apporder

骚操作之改造TabLayout,修改指示线宽增加切Tab过渡动画

Programming Languages

java
68154 projects - #9 most used programming language

Projects that are alternatives of or similar to Apporder

un-material-tab
(deprecated) Custom tab layout which can be used as a material TabLayout alternative and contains basic functionality which Google's TabLayout has.
Stars: ✭ 83 (-66.26%)
Mutual labels:  custom-view, tablayout
Magicindicator
A powerful, customizable and extensible ViewPager indicator framework. As the best alternative of ViewPagerIndicator, TabLayout and PagerSlidingTabStrip —— 强大、可定制、易扩展的 ViewPager 指示器框架。是ViewPagerIndicator、TabLayout、PagerSlidingTabStrip的最佳替代品。支持角标,更支持在非ViewPager场景下使用(使用hide()、show()切换Fragment或使用setVisibility切换FrameLayout里的View等),http://www.jianshu…
Stars: ✭ 8,969 (+3545.93%)
Mutual labels:  indicator, tablayout
Jpagerslidingtabstrip
🔥A useful tablayout modify from astuetz/PagerSlidingTabStrip
Stars: ✭ 233 (-5.28%)
Mutual labels:  custom-view, tablayout
Circularseekbar
Custom circular SeekBar (Circle, Semi-circle, and Ellipse) for Android
Stars: ✭ 166 (-32.52%)
Mutual labels:  custom-view
Flexiblesearchbar
可以伸缩的搜索栏,模仿华为应用市场
Stars: ✭ 177 (-28.05%)
Mutual labels:  custom-view
Circularprogressbar
CircularProgressbar project let you create circular progressbar in android
Stars: ✭ 188 (-23.58%)
Mutual labels:  custom-view
Pageindicator
An Instagram like page indicator compatible with RecyclerView and ViewPager.
Stars: ✭ 236 (-4.07%)
Mutual labels:  indicator
Raised Center Tab In Android
Customized tabhost having raised center tab.
Stars: ✭ 158 (-35.77%)
Mutual labels:  tablayout
Stepindicator
StepIndicator is an iOS library that indicates steps in an animated way.
Stars: ✭ 229 (-6.91%)
Mutual labels:  indicator
Tagimageview
高仿小红书标签添加功能 1.随点击处添加标签 2.计算标签位置 3.可将标签位置还原渲染至不同屏幕尺寸 4.拖拽删除标签
Stars: ✭ 186 (-24.39%)
Mutual labels:  custom-view
Dotsindicator
Three material Dots Indicators for view pagers in Android !
Stars: ✭ 2,447 (+894.72%)
Mutual labels:  indicator
Loadmorewrapper
📦 make recyclerView supports load more and customize the footer view, without changes to the original adater of recyclerView. 在不改动 RecyclerView 原有的 adapter 的情况下,使 RecyclerView 滑动到底部的时候能够加载更多和自定义底部视图。
Stars: ✭ 179 (-27.24%)
Mutual labels:  custom-view
Cropiwa
📐 Configurable Custom Crop widget for Android
Stars: ✭ 2,185 (+788.21%)
Mutual labels:  custom-view
Llsegmentviewcontroller
可添加header的多控制器列表,主流APP分类切换滚动视图(京东,网易新闻,爱奇艺,QQ弹性小球等,可高度自定义,项目结构清晰);UIScrollView 嵌套,可做个人详情页,商品详情页,页面多tableView滑动悬停
Stars: ✭ 176 (-28.46%)
Mutual labels:  indicator
Circularprogressindicator
Customizable circular progress indicator
Stars: ✭ 232 (-5.69%)
Mutual labels:  indicator
Cardslider
Card Slider is an android component allows you to implement carousel effect with infinite indicators and more features
Stars: ✭ 160 (-34.96%)
Mutual labels:  indicator
Tabscrollattacher
Attach TabLayout and RecyclerView. Useful for categorizing RecyclerView items.
Stars: ✭ 196 (-20.33%)
Mutual labels:  tablayout
Android Passcodeview
A custom view with keyboard and character display to be used for authentication
Stars: ✭ 182 (-26.02%)
Mutual labels:  custom-view
Certificatecamera
证件相机-证件拍照及裁剪
Stars: ✭ 187 (-23.98%)
Mutual labels:  custom-view
Parallaxrecyclerview
Parallax effect on every item of your RecyclerView.
Stars: ✭ 237 (-3.66%)
Mutual labels:  custom-view

最近接到一个任务,就是要修改原来用的官方support包TabLayout中的指示器线宽,改成固定值,当然网上有什么反射加padding什么的,可是治标不治本,切Tab过渡动画也加不了,什么?你告诉我github又xxx类似控件,可是为什么我要放弃google大神的源码呢,改改就能增加新功能了呢,为了达到目的,我就开始了下面一系列骚操作。

0. 老规矩,先放效果图

图片描述

1. 骚操作之一:copy support包TabLayout 一份当做自己的自定义view

本次骚操作是基于support '27.1.0'版本,从support '27.1.0'拷出文件到我的项目目录如下图,蓝色部分,四个文件,当然不是一帆风顺的,需要改点包名,取消掉一下注解警告,总之后面会放出源码

不同的版本可能需要拷贝出来的文件不一样哟,于support '27.1.0'版本需要拷出上图蓝色的4个文件

2. 骚操作之二: fuck源代码,读懂之后开始改造

首先指示器的线是画出来的,关键代码如下 (以下改动代码均为tabLayout类)

   canvas.drawRect(mIndicatorLeft, getHeight() - mSelectedIndicatorHeight,
                            mIndicatorRight, getHeight(), mSelectedIndicatorPaint);

OK, mIndicatorLeft是滚动或者点击切tab时候通过偏移量计算出来的,总之不重要,完成第一个目标。修改指示器线宽,思路呢,就是给mIndicatorLeft和mIndicatorRight做一个偏移量就行了, 看看我怎么改的吧

其中2个成员变量是我在SlidingTabStrip类中新增的

 private int mSelectedIndicatorWidth =  dpToPx(27);;
        private int mMinTabWidth = Integer.MAX_VALUE;

我这里偷懒一下就不做方法暴露了,直接写死了线宽为27dp了

好了,已经完成修改线宽目标了。(扩展一下:这里你也可以修改draw方法,画个图,或者画个小圆圈什么的)

接下来增加指示线滑动切tab的过渡动画

很简单我就放代码吧,关键就是在onPageScrolled方法里面做点手脚

总共改动就50来行吧,就达成效果了。是不是很简单。(简单才怪,总之做出来之后觉得确实蛮简单的) 这样改好处多多,为什么呢?xml基本不需要改变,tablayout名字改一下,代码也是导包改一下,替换官方tablayout的时候代码几乎不需要变化,是不是很爽?

3. github下载,喜欢就给个star吧,如果对你有帮助的话

https://github.com/zjw-swun/AppOrder

4. 总结

官方support包就是可以这么任性的拷贝出来,有时候一个拷出一个类根本没涉及到别的类,善假于物也。

License

Copyright 2018 zjw-swun

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.
Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].