Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
TabLayoutの「選択されていないインジケーター」にも色を付けるには
Search
みっちゃん
June 14, 2023
0
37
TabLayoutの「選択されていないインジケーター」にも色を付けるには
みっちゃん
June 14, 2023
Tweet
Share
More Decks by みっちゃん
See All by みっちゃん
ドキュメントから adbコマンドの仕組みを読み解く
mitchan
1
130
2024年は難読化と仲良くなりたい
mitchan
0
200
STORES二年生が得た新しい視点
mitchan
0
220
Material Design とは
mitchan
0
59
勉強方法としてのコミュニティ活用
mitchan
0
660
Android端末のNFCを無効化しようとしてダメだった話
mitchan
1
4k
頑張ってKotlin率をちょっとあげた話
mitchan
0
170
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
75
5.2k
Building a Modern Day E-commerce SEO Strategy
aleyda
21
6.4k
It's Worth the Effort
3n
180
27k
Fantastic passwords and where to find them - at NoRuKo
philnash
39
2.5k
The Language of Interfaces
destraynor
151
23k
We Have a Design System, Now What?
morganepeng
43
6.8k
Fontdeck: Realign not Redesign
paulrobertlloyd
76
4.9k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
41
4.4k
Raft: Consensus for Rubyists
vanstee
133
6.3k
Java REST API Framework Comparison - PWX 2021
mraible
PRO
18
6.9k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
123
39k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Transcript
登壇者:みっちゃん TabLayoutの「選択されていないインジケー ター」にも色を付けるには
自己紹介 名前:みっちゃん 会社:STORES inc.(22卒) 役職:Androidエンジニア Twitter Qiita
このTabLayoutのデザイン、どう作りますか? 3
よ〜〜〜〜く、見ると・・・? 4
やること 5 1. 選択されたTabのインジケーターに色(黒)をつける 2. 選択されていないTabのインジケーターにも色(グレー)をつける
選択されたTabのインジケーターに色をつける 6 公式ドキュメントにやり方が書かれてる通り
選択されたTabのインジケーターに色をつける 7 命名からも分かる通り 選択されたTabのインジケーターの色を変更する
選択されていないTabのインジケーターに色をつける 8 公式ドキュメントをみても...ない?!?!
工夫してなんとかするしかない 9 結論 • Tabの下にボーダーを配置するようなdrawableを作成 • TabLayoutのbackgroundに設定
Tabの下にボーダーを配置するようなdrawableを作成 10
Tabの下にボーダーを配置するようなdrawableを作成 11
Tabの下にボーダーを配置するようなdrawableを作成 12
Tabの下にボーダーを配置するようなdrawableを作成 13
Tabの下にボーダーを配置するようなdrawableを作成 14
layer-list に対して padding を設定している 15
最終的に描画されるもの 16 さっきのサンプルコードで最終的に 描画されるもの → わかりにくいですね... 背景色が透明の四角形の底辺だけにグレー の枠線が残っている図 です...
TabLayoutのbackgroundに設定 17
お わ り(♡) 18