Android自定义的SeekBar

  • TextView设置删除线
mTvDemo.setPaintFlags(Paint.STRIKE_THRU_TEXT_FLAG);
  • TextView设置文本格式
mTvPay.setText(String.format(getString(R.string.price_format_pay), mPayDetail.price));
其中
<string name="price_format_pay">支付¥%1$s</string>
更多的格式,比如视频播放时间:特殊符号用\转义,02d表示接收的是数字,格式为两位,不足的前面补0。这个格式接收两个数字作为参数,下面的设置会显示03'19''
<string name="mv_video_time">%1$02d\'%2$02d\"</string>
mTvTime.setText(String.format(getString(R.string.mv_video_time), 3,19));
  • 自定义带二级进度的seekbar样式
    效果图:
image.png
  1. seekbar的xml
        <SeekBar
            android:id="@+id/sb_player_seek_bar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:maxHeight="3dp"
            android:minHeight="3dp"
            android:background="@null"
            android:paddingLeft="4dp"
            android:paddingRight="4dp"
            android:progressDrawable="@drawable/seekbar_bkg"
            android:thumb="@drawable/icon_play_seek_point"/>

icon_play_seek_point是一个进度标志的icon,android:maxHeight与android:minHeight控制进度条的高度,这个不影响进度icon的大小。

  1. 进度相关的drawable:seekbar_bkg.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item
        android:id="@android:id/background"
        android:drawable="@drawable/seekbar_progress_bkg"/>
    <item android:id="@android:id/secondaryProgress">
        <clip android:drawable="@drawable/seekbar_progress_second" />
    </item>
    <item android:id="@android:id/progress">
        <clip android:drawable="@drawable/seekbar_progress_first" />
    </item>
</layer-list>
  1. 各级背景的xml:

3.1 seekbar_progress_bkg.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
    <stroke android:width="3dp" android:color="@color/global_ffe0e0e0" />
</shape>

3.2 seekbar_progress_first.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
    <stroke android:width="3dp" android:color="@color/global_ffff4338" />
</shape>

3.3 seekbar_progress_second.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="line">
    <stroke android:width="3dp" android:color="@color/global_ffe0e0e0" />
</shape>

3.4 取消seekbar的点击和滑动功能,只作为展示用

 mSeekBar.setOnTouchListener(new OnTouchListener() {
      @Override
      public boolean onTouch(View v, MotionEvent event) {
           // 禁止拖动和点击
           return true;
       }
     });
  • 设计说要加上圆角,正好精简一下:
  1. 直接用一个样式搞定,seekbar_bkg_two_progress.xml
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:id="@android:id/background">
        <shape>
            <solid android:color="@color/global_ffe0e0e0"/>
            <corners android:radius="4dp"/>
        </shape>
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <solid android:color="@color/global_ff666666" />
                <corners android:radius="4dp"/>
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <solid android:color="@color/global_ffff4338" />
                <corners android:radius="4dp"/>
            </shape>
        </clip>
    </item>

</layer-list>
  1. 定义一个style用于格式通用:
    <style name="mv_video_play_seekbar">
        <item name="android:maxHeight">3dp</item>
        <item name="android:minHeight">3dp</item>
        <item name="android:max">100</item>
        <item name="android:background">@null</item>
        <item name="android:paddingLeft">8dp</item>
        <item name="android:paddingRight">8dp</item>
        <item name="android:layout_marginLeft">3dp</item>
        <item name="android:layout_marginRight">3dp</item>
        <item name="android:thumbOffset">8dp</item>
        <item name="android:progressDrawable">@drawable/seekbar_bkg_two_progress</item>
        <item name="android:thumb">@drawable/icon_play_seek_point</item>
    </style>
  1. 关于Activity主题的问题:
    系统SeekBar的thumb用的带阴影的png,当Activity时非透明的主题时,尽管边界为透明,阴影还是会影响显示,圆形两侧有缝隙:
image.png
image.png

所以用带阴影的切图的话,上下可以有透明阴影,两端不能有投影,要紧贴圆形的左右边界,都是因为没有仔细想,只是一味的看现象改代码。最后,用layer-list代码创造阴影:
style中改为:

<item name="android:thumb">@drawable/seek_bar_thumb_shadow</item>

其中seek_bar_thumb_shadow.xml为

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:id="@android:id/background">
        <shape>
            <solid android:color="@color/global_ffe0e0e0"/>
            <corners android:radius="4dp"/>
        </shape>
    </item>
    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <solid android:color="@color/global_ff666666" />
                <corners android:radius="4dp"/>
            </shape>
        </clip>
    </item>
    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <solid android:color="@color/global_ffff4338" />
                <corners android:radius="4dp"/>
            </shape>
        </clip>
    </item>
</layer-list>

一个简单的样式,如此多细节,关键是没有真正弄明白各种样式,主题和作用机制,面向运气编程果真不靠谱啊!
所以,去自定义吧

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 202,607评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,047评论 2 379
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 149,496评论 0 335
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,405评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,400评论 5 364
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,479评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,883评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,535评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,743评论 1 295
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,544评论 2 319
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,612评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,309评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,881评论 3 306
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,891评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,136评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,783评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,316评论 2 342

推荐阅读更多精彩内容

  • afinalAfinal是一个android的ioc,orm框架 https://github.com/yangf...
    passiontim阅读 15,392评论 2 45
  • 要玩好定位的游戏,就要遵守定位的游戏规则。首先,你必须理解文字。文字本身是没有含义的,含义是在使用文字的人身上。给...
    爱星星的牛爸阅读 365评论 0 0
  • 薇 浓眉大眼的姑娘 不完美的原生家庭 灰色的童年 这并不阻挡她对生活的追求 尽管毕业至今未曾相见 现在想起仍是她那...
    工匠Arya阅读 161评论 7 1
  • 取经行动674/1001(17.7.28) 1 .写作的初衷是什么? 坚定一件事情,让自己持续做下去,看看自己的耐...
    石林萍阅读 493评论 7 7
  • 这个周末过的是相当的曲折,小孩出生两年来没这么折腾过。小孩上周一开始发烧,烧了三天后,医院方面担心会变成肺炎,建...
    jelabrant阅读 269评论 0 1