2026.09.03 10:20 ~ 11:00 Meerkat

Jetpack Compose で挑む新聞紙面UI ─ 複合ジェスチャー・ポリゴン記事領域・適応的ページ構成という3つの壁

Jetpack Compose 日本語

新聞紙面UIは、一般的なリスト型・カード型のUIとは異なる固有の要件を持っています。 ・紙面1ページが1枚の画像として配信される ・ページスワイプ・ピンチイン/アウト・ダブルタップが同時に機能する複合ジェスチャー ・各記事の領域は段組みに合わせた多角形(ポリゴン)の座標列で定義される ・選択した記事だけを浮かび上がらせるスポットライト表示 ・媒体によってページング方向が変わり、横向きでは見開き2ページが並ぶ これらの組み合わせが、Compose の標準的な使い方では素直に解決できない難所を生み出します。 実プロダクトへの移行を見据えて検証した実装を題材に、直面した3つの技術的挑戦を解説します。 1. 複合ジェスチャーの競合解決 ページャー内でピンチズームを実現しようとすると、横スワイプとのジェスチャー競合が発生します。 この競合を解消するためのジェスチャーの判定制御とズームアニメーションのアプローチを紹介します。 2. ポリゴン当たり判定とスポットライト描画 記事の領域はポリゴン座標列で定義されるため、タップ位置とポリゴンの当たり判定が必要です。 ズーム状態での座標変換と、選択記事を浮かび上がらせるスポットライト描画の実装方針を解説します。 3. 適応的ページ構成の設計 媒体の種類によってページング方向が変わり、横画面では2ページの見開き表示になり、表示ページ数の変化は座標計算にも影響を与えます。 媒体ごとの特性と構成変更によるUIの変化といった条件を Compose でどう扱うか、そのアプローチを探ります。 View/XML 実装との比較をもとに複雑な要件に Compose がどこまで応えられるか、検証を通じて見えてきた知見をお伝えします。

対象者

・Jetpack Compose での基本的な実装経験があり、入り組んだUIの実装に興味がある方 ・View/XML から Compose への移行を検討しており、複雑なUI領域での適用可能性を知りたい方 ・紙媒体が好きな方、あるいは現実の体験をコードで再現することにロマンを感じる方

同じ時間帯のセッション

すべてのセッションを見る