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
文字拡大されても怖くない レイアウト作りのコツ
Search
Tiphaine
July 14, 2023
Technology
4
2.7k
文字拡大されても怖くない レイアウト作りのコツ
Shibuya.apk #43
https://shibuya-apk.connpass.com/event/288211/
Tiphaine
July 14, 2023
Tweet
Share
More Decks by Tiphaine
See All by Tiphaine
Handling focus in 2024
tahia910
0
740
Matomoを使ってみた
tahia910
0
1.8k
社内でできるアクセシビリティのはじめかた
tahia910
3
530
Raise accessibility awareness at work as an Android developer
tahia910
1
130
社内でのアクセシビリティ推進
tahia910
3
5k
Promoting mobile accessibility at work
tahia910
0
200
GitHubのユーザー名を変更した後のあれこれ
tahia910
0
380
2021年こそアクセシビリティと向き合おう(40分版)/ It s 2021 let s support accessibility
tahia910
0
330
Other Decks in Technology
See All in Technology
エムスリーマルチデバイスチーム紹介資料 / Introduction of M3 Multi Device Team
m3_engineering
1
170
生成AIがもたらす変革 / GitHubGalaxy_CyberAgent
cyberagentdevelopers
PRO
2
110
生成AIと産業向けソフトウェアの自動生成 〜 ハノーバーメッセ2024より〜
kioto
2
430
NewSQL Landscape
oracle4engineer
PRO
5
3.2k
OPENLOGI Company Profile
hr01
0
46k
PHP 9 に備えよ - 動的プロパティ、どうすればいぃ?
taisukearase
0
340
拓展QA日常工作的邊界
line_developers_tw
PRO
0
560
Oracle Cloud Infrastructureデータベース・クラウド:各バージョンのサポート期間
oracle4engineer
PRO
12
7.9k
技術力の伸ばし方を考える
khirata
0
140
QA経験のないエンジニアリング マネージャーがQAのカジュアル面談に出て 苦労していること・気づいたこと / scrum fest niigata 2024
yoshikiiida
2
670
TypescriptでのContextualな構造化ロギングと社内全体への導入
leveragestech
3
590
TDD - Test Driven Drupal
opdavies
0
3k
Featured
See All Featured
Making Projects Easy
brettharned
109
5.5k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
8
3.5k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
84
45k
The MySQL Ecosystem @ GitHub 2015
samlambert
244
12k
Designing Experiences People Love
moore
136
23k
Large-scale JavaScript Application Architecture
addyosmani
504
110k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
188
16k
Happy Clients
brianwarren
92
6.4k
Code Review Best Practice
trishagee
56
15k
Web development in the modern age
philhawksworth
203
10k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
14
1.5k
The Illustrated Children's Guide to Kubernetes
chrisshort
32
47k
Transcript
Shibuya.apk#43ɹ2023.7.14ɹTiphaineɹ จࣈ֦େ͞Εͯා͘ͳ͍ ϨΠΞτ࡞Γͷίπ
ࣗݾհ ✤ Tiphaine(ςΟϑΣϯ) ✤ AndroidΤϯδχΞ ✤ϝυϐΞגࣜձࣾ
จࣈ֦େʁ ✤ Ϣʔβʔิॿػೳ ✤ ϑΥϯτͱදࣔ྆ํͱ ✤ ʹΑͬͯσϑΥϧτͷ ઃఆͰ͋Δ͔
·͊ɺSPΛ͑ ͳΜͱ͔ͳΔͰ͠ΐ͏ …ͦͷͣͩͬͨ
STORY TIME
ʮܾఆϘλϯ͕ग़ͯͳ͍ Ͱ͚͢Ͳʔʯ
None
None
จࣈ֦େΛ͢Δͱ Ϙλϯ͕ݟ͑ͳ͍
͔͠ ͜ͷը໘͚ͩ͡Όͳ͍
😇
࠶ൃࢭରࡦͷͨΊʹ ࢀߟ͕ཉ͍͠
“ WCAG ୡج४1.4.4ɹςΩετͷαΠζมߋ (…)ςΩετɺ ίϯςϯπຢػೳΛଛͳ͏͜ͱͳ͘ɺ ࢧԉٕज़ͳ͠Ͱ200%·ͰαΠζมߋͰ͖Δɻ
➤ શͯͷςΩετΛ֦େͰ͖Δ ➤ શͯͷςΩετ͕ಡΊΔ ➤ શͯͷػೳ͕͑Δ ඪ
͍ͭಉ͡ʹͳΔ ࡞Δ࣌ʹରࡦͰ͖Δ
ؾΛ͚ͭΔ͖ϙΠϯτ 1⃣ εΫϩʔϧ 2⃣ Margin/Padding 3⃣ লུͱվߦ
1⃣ εΫϩʔϧ ✤ ΧελϜϨΠΞτɺ·ͨComposeΛ͏ͳΒɺ શମεΫϩʔϧग़དྷΔΑ͏ʹ͠Α͏ AμΠΞϩάʹ͍ͭͯ εΫϩʔϧͰ͖ͳ͍ ➡︎
1⃣ εΫϩʔϧ ✤ AlertDialog͍ςΩετΛsetTitleͰઃఆ͠ͳ͍ AμΠΞϩάʹ͍ͭͯ AlertDialog.Builder(this) .setTitle(“λΠτϧʹඇৗʹ…”) .setPositiveButton("ܾఆ", /*…*/) .setNegativeButton("Ωϟϯηϧ",
/*…*/) .show() ̎ߦͰলུ͞Εͯ͠·͏ ➡︎
AlertDialog.Builder(this) .setTitle(“λΠτϧʹඇৗʹ…”) .setPositiveButton("ܾఆ", /*…*/) .setNegativeButton("Ωϟϯηϧ", /*…*/) .show() AlertDialog.Builder(this) .setTitle(“λΠτϧʹඇৗʹ…”) .setMessage(“λΠτϧʹඇৗʹ…”)
.setPositiveButton("ܾఆ", /*…*/) .setNegativeButton("Ωϟϯηϧ", /*…*/) .show() 1⃣ εΫϩʔϧ ➡ setMessageΛ͓͏ AμΠΞϩάʹ͍ͭͯ
✤ ϢʔβʔͷखؒΛݮΒͨ͢Ίɺॏࢹ͍ͨ͠෦͚ͩΛ εΫϩʔϧൣғ͔Β֎ͦ͏ 1⃣ εΫϩʔϧ A෦తʹݻఆ͢Δ
A෦తʹݻఆ͢Δ 1⃣ εΫϩʔϧ ݻఆ෦ εΫϩʔϧ Մೳ෦
✤ εΫϩʔϧͰ͖ΔࣄΛ໌֬ʹ͍͔ͨ͠Βɺ Πϯδέʔλʔফ͑ͳ͍Α͏ʹ͢Δ ✤ Compose·ͩͰ͖ͳ͍😣 1⃣ εΫϩʔϧ AΠϯδέʔλʔΛදࣔ͢Δ android:fadeScrollbars="false" android:scrollbarAlwaysDrawVerticalTrack="true"
android:scrollbarSize="4dp" android:scrollbarThumbVertical=“@color/…” android:scrollbars="vertical"
1⃣ εΫϩʔϧ AΠϯδέʔλʔΛදࣔ͢Δ
2⃣ MARGIN / PADDING ✤ ࠨӈͷmarginΛΕͳ͍
2⃣ MARGIN / PADDING ✤ ࠨӈ/্ԼpaddingΕͳ͍ʢಛʹΧελϜϏϡʔʣ
✤ padding͕ޮ͘Α͏ʹɺඞͣ minHeight/minWidthΛ͓͏ 3⃣ লུͱվߦ AαΠζΛݻఆ͠ͳ͍ Modifier.defaultMinSize(minHeight = …) android:layout_height="wrap_content"
android:minHeight=“@dimen/…”
✤ λοϓͯ͠ଓ͖͕ಡΊΔจষܥͳΒ🆗 ✤ ΞΫγϣϯΛى͜͢Ϙλϯܥ🆖 ❌ ✅ ✅ ✅ ELLIPSISͷ͍ํ 3⃣
লུͱվߦ
✤ Horizontal LinearLayoutɺ·ͨComposeͷRow ෯ͷweightͳͲΛࢦఆ͠Α͏ ROWܥཁҙ ӈͷཁૉ͕֎ԡ͞Εͯ͠·͏ ⬆︎ 3⃣ লུͱվߦ
✤ ςΩετೖྗܥग़དྷΔ͚ͩϚϧνϥΠϯՄೳʹ͢Δ ✦ ʢจࣈ੍ݶͷӨڹͰແཧ͔😥ʣ ✦ ʢώϯτͷ͞ʹ߹Θͤͯվߦ͞Εͳ͍͔😭ʣ 3⃣ লུͱվߦ AςΩετೖྗʹ͍ͭͯ
⚠ ANDROID STUDIOͷϓϨϏϡʔ ✤ ࣮ػͱൺͯ෯͕͗͢Δ
ݕূʹ͋Εແఢɿ Β͘Β͘εϚʔτϑΥϯ
·ͱΊ ✤ ϑϨʔϜϫʔΫΛ৴༻͗͢͠ͳ͍ ✤ ͻͨ͢ΒεΫϩʔϧΛೖΕΔ ✤ εΫϩʔϧͰ͖Δ͜ͱΛ໌֬ʹ͢Δ ✤ EllipsisΛਖ਼͘͠͏ ✤
Ͱ͖Δ͚ͩϚϧνϥΠϯՄೳʹ͢Δ
͝ਗ਼ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠ @tahia910ɹ