More Related Content
Similar to Viewを動的に変化させるアプローチ (20)
More from Takao Sumitomo (20)
Viewを動的に変化させるアプローチ
- 1. DroidKaigi 2017 - 2017/03/09 @cattaka_net
Viewを動的に
変化させるアプローチ
Takao Sumitomo
@cattaka_net
- 2. DroidKaigi 2017 - 2017/03/09 @cattaka_net
自己紹介
●
住友 孝郎(Takao Sumitomo)
●
Androidアプリ開発者
●
今やってること
●
Androidアプリケーション
●
昔やってたこと
●
いろいろ(MFCとかStrutsとか)
●
ウォンテッドリー株式会社所属
●
2014年12月〜
●
それ以前は関西で仕事してた
- 3. DroidKaigi 2017 - 2017/03/09 @cattaka_net
直近のアプリ
かしこく、名刺管理
人工知能を搭載したカメ
ラで、10枚までの名刺を
わずか3秒でデータ化、そ
して管理可能な、無料で
使えるビジネスパーソン向
けのアプリです。
- 4. DroidKaigi 2017 - 2017/03/09 @cattaka_net
発表の内容
●
お題
●
ユーザーの操作に追従させたい
●
キーワード
●
DataBinding
●
ConstraintLayout
●
Material Designに特化した話ではなく、どう実装
するかのお話
- 6. DroidKaigi 2017 - 2017/03/09 @cattaka_net
アニメーション
●
ViewPagerの切替時
●
FABが操作の完了時に
出てくる
- 7. DroidKaigi 2017 - 2017/03/09 @cattaka_net
AppBarLayout
●
一定以上スクロールす
ると、色が変わる
●
タイトルのみ動かせる
●
補足:このサンプルはバ
グのため動かせなかっ
た、、
- 10. DroidKaigi 2017 - 2017/03/09 @cattaka_net
実装アプローチのイメージ
●
意識するのは3つ
●
操作イベント
●
属性値の計算
●
Viewの更新
操作イベント
属性値の計算
Viewの更新
- 13. DroidKaigi 2017 - 2017/03/09 @cattaka_net
操作イベント
属性値の計算
Viewの更新
タッチイベントは辛い
●
タッチイベントは種類がいっぱい
●
全部で何個種類があるか全部言える人いる?
●
マルチタッチになるとどうなる?
●
ネステッドスクロールはさらに難解
●
flingが入るともうカオス
●
CoordinatorLayoutのBehaviorも同じ
- 14. DroidKaigi 2017 - 2017/03/09 @cattaka_net
操作イベント
属性値の計算
Viewの更新
無難なイベント
●
スクロールイベント系
●
ScrollView
●
RecyclerView
●
AppBarLayout
●
レイアウト系イベント
●
OnLayoutChangeListener
●
OnGlobalLayoutListener
– ただし注意しないとループに嵌まる
- 15. DroidKaigi 2017 - 2017/03/09 @cattaka_net
操作イベント
属性値の計算
Viewの更新
よくよく考えると
●
タッチ操作でViewを変化させるというより
●
他のViewに合わせて動くと考えるほうが自然
ViewPagerで
発生したイベント
表示を更新
表示を更新
スクロール量から
計算
- 16. DroidKaigi 2017 - 2017/03/09 @cattaka_net
操作イベント
属性値の計算
Viewの更新
Viewの属性値の計算はどこでやる?
- 17. DroidKaigi 2017 - 2017/03/09 @cattaka_net
操作イベント
属性値の計算
Viewの更新
コードでゴリゴリやる
●
行数が増えがちになる
●
コードを読まないとどういう動きかわからない
●
なのであまりやりたくない
- 18. DroidKaigi 2017 - 2017/03/09 @cattaka_net
属性値の計算は分けて考える
●
スクロール量などの値を正規化した値にする
●
具体的な属性値への計算は別途やる
0.0〜1.0に
なるように
0.0〜3.0になるように
- 19. DroidKaigi 2017 - 2017/03/09 @cattaka_net
操作イベント
属性値の計算
Viewの更新
ViewPagerでの計算
●
タブは0.0〜3.0の値か
ら計算
●
FABは0.0〜1.0の値か
ら計算
- 20. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ViewPagerでの計算
@Override
public void onPageScrolled(
int position, // 0,1,2などのページ番号
float positionOffset, // 0.0〜1.0の範囲のオフセット
int positionOffsetPixels) {
float absolutePosition = position + positionOffset;
float fabFactor = (position == 0) ? positionOffset : 1;
/* 省略 */
}
本質はここ
0.0〜3.0 の値を算出
- 21. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ViewPagerでの計算
1ページ目のみ
0.0〜1.0 の値が欲しい
@Override
public void onPageScrolled(
int position, // 0,1,2などのページ番号
float positionOffset, // 0.0〜1.0の範囲のオフセット
int positionOffsetPixels) {
float absolutePosition = position + positionOffset;
float fabFactor = (position == 0) ? positionOffset : 1;
/* 省略 */
}
- 22. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ScrollViewでの計算
●
0.0〜1.0の値から諸々の
属性値を計算する
●
ActionBar
●
タイトル
– 座標と色
●
アイコン
●
その他のテキスト
– 座標と色
- 23. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ScrollViewでの計算
@Override
public void onScrollChange(NestedScrollView v,
int scrollX, int scrollY, int oldScrollX, int
oldScrollY) {
int h = mBinding.layoutContents.image.getHeight();
float factor = (h > 0) ? (float) scrollY / h : 0f;
if (factor < 0f) {
factor = 0f;
} else if (factor > 1f) {
factor = 1f;
}
/* 省略 */
}
本質はここ
0.0〜1.0 の値を算出
- 24. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ScrollViewでの計算
@Override
public void onScrollChange(NestedScrollView v,
int scrollX, int scrollY, int oldScrollX, int
oldScrollY) {
int h = mBinding.layoutContents.image.getHeight();
float factor = (h > 0) ? (float) scrollY / h : 0f;
if (factor < 0f) {
factor = 0f;
} else if (factor > 1f) {
factor = 1f;
}
/* 省略 */
}
0除算に注意
- 25. DroidKaigi 2017 - 2017/03/09 @cattaka_net
Viewに設定する属性値の計算
●
対象となる属性
●
alpha
●
width / height
●
translationX / translationY
●
scaleX / scaleY
●
textSize
●
etc
●
この辺りの計算はDataBindingの計算が便利
- 27. DroidKaigi 2017 - 2017/03/09 @cattaka_net
操作イベント
属性値の計算
Viewの更新
DataBindingが強い
●
変数を渡せる
●
計算式が書ける
- 28. DroidKaigi 2017 - 2017/03/09 @cattaka_net
DataBindingの変数
<layout>
<data>
<variable name="fabFactor" type="float" />
</data>
<RelativeLayout android:id="@+id/layout">
<!-- 省略 -->
</RelativeLayout>
</layout>
mBinding.setFabFactor(fabFactor);
layout xmlでの定義
Java側から渡す
xmlで定義すると
setterが作られる
- 29. DroidKaigi 2017 - 2017/03/09 @cattaka_net
DataBindingで計算
<android.support.design.widget.FloatingActionButton
android:id="@+id/button_search"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:translationY="@{fabFactor * @dimen/fab_offset}" />
dimenの値に掛け算で
楽に設定できる
※:@dimen/fab_offset より良い方法を後述
- 31. DroidKaigi 2017 - 2017/03/09 @cattaka_net
FABの現れ方
●
完全に隠れるには
親のheight - 自分のtop
が必要になる
自分のtop
親のheight
これ
- 32. DroidKaigi 2017 - 2017/03/09 @cattaka_net
FABの現れ方
<RelativeLayout android:id="@+id/layout">
<!-- 他のViewは省略 -->
<android.support.design.widget.FloatingActionButton
android:id="@+id/button_search"
android:layout_alignParentBottom="true"
android:layout_alignParentEnd="true"
android:translationY="@{fabFactor *
(layout.getHeight() - buttonSearch.getTop())}"
/>
</RelativeLayout>
translationYに
必要な値をここで計算
- 33. DroidKaigi 2017 - 2017/03/09 @cattaka_net
タブの動き
●
文字サイズを変える
●
背景色を変える
●
elevationを変える
●
幅を変える
- 34. DroidKaigi 2017 - 2017/03/09 @cattaka_net
タブの動き
<TextView
android:id="@+id/tab_0"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@{DataBindingFunctions.evaluateColor(position, 0f, @color/bgTab, @color/bgTabSelected)}"
android:elevation="@{DataBindingFunctions.evaluateFactor(position, 0f, 0f, @dimen/elevation_tab)}"
android:gravity="center"
android:text="List"
android:textAppearance="?android:textAppearanceMedium"
android:textSize="@{DataBindingFunctions.evaluateFactor(position, 0f, @dimen/text_tab_small, @dimen/text_tab_large)}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/tab_1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:setLayoutWeight="@{DataBindingFunctions.evaluateFactor(position, 0f, 3f, 4f)}"
/>
- 35. DroidKaigi 2017 - 2017/03/09 @cattaka_net
タブの動き:文字サイズを変える
<TextView
android:id="@+id/tab_0"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@{DataBindingFunctions.evaluateColor(position, 0f, @color/bgTab, @color/bgTabSelected)}"
android:elevation="@{DataBindingFunctions.evaluateFactor(position, 0f, 0f, @dimen/elevation_tab)}"
android:gravity="center"
android:text="List"
android:textAppearance="?android:textAppearanceMedium"
android:textSize="@{DataBindingFunctions.evaluateFactor(position, 0f, @dimen/text_tab_small, @dimen/text_tab_large)}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/tab_1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:setLayoutWeight="@{DataBindingFunctions.evaluateFactor(position, 0f, 3f, 4f)}"
/>
android:textSize="@{
DataBindingFunctions.evaluateFactor(
position, ←スクロール位置(0.0〜3.0)
0f, ←対象タブの番号(0,1,2)
@dimen/text_tab_small,←未選択時のサイズ
@dimen/text_tab_large ←選択時のサイズ
)}"
独自の補間用メソッド
- 36. DroidKaigi 2017 - 2017/03/09 @cattaka_net
タブの動き:背景色を変える
<TextView
android:id="@+id/tab_0"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@{DataBindingFunctions.evaluateColor(position, 0f, @color/bgTab, @color/bgTabSelected)}"
android:elevation="@{DataBindingFunctions.evaluateFactor(position, 0f, 0f, @dimen/elevation_tab)}"
android:gravity="center"
android:text="List"
android:textAppearance="?android:textAppearanceMedium"
android:textSize="@{DataBindingFunctions.evaluateFactor(position, 0f, @dimen/text_tab_small, @dimen/text_tab_large)}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/tab_1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:setLayoutWeight="@{DataBindingFunctions.evaluateFactor(position, 0f, 3f, 4f)}"
/>
android:background="@{
DataBindingFunctions.evaluateColor(
position, ←スクロール位置(0.0〜3.0)
0f, ←対象タブの番号(0,1,2)
@color/bgTab, ←未選択時の色
@color/bgTabSelected ←選択時の色
)}"
独自の補間用メソッド
- 37. DroidKaigi 2017 - 2017/03/09 @cattaka_net
タブの動き:elevationを変える
<TextView
android:id="@+id/tab_0"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@{DataBindingFunctions.evaluateColor(position, 0f, @color/bgTab, @color/bgTabSelected)}"
android:elevation="@{DataBindingFunctions.evaluateFactor(position, 0f, 0f, @dimen/elevation_tab)}"
android:gravity="center"
android:text="List"
android:textAppearance="?android:textAppearanceMedium"
android:textSize="@{DataBindingFunctions.evaluateFactor(position, 0f, @dimen/text_tab_small, @dimen/text_tab_large)}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/tab_1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:setLayoutWeight="@{DataBindingFunctions.evaluateFactor(position, 0f, 3f, 4f)}"
/>
android:elevation="@{
DataBindingFunctions.evaluateFactor(
position, ←スクロール位置(0.0〜3.0)
0f, ←対象タブの番号(0,1,2)
0f, ←未選択時の値
@dimen/elevation_tab ←選択時の値
)}"
独自の補間用メソッド
- 38. DroidKaigi 2017 - 2017/03/09 @cattaka_net
タブの動き:幅を変える
<TextView
android:id="@+id/tab_0"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@{DataBindingFunctions.evaluateColor(position, 0f, @color/bgTab, @color/bgTabSelected)}"
android:elevation="@{DataBindingFunctions.evaluateFactor(position, 0f, 0f, @dimen/elevation_tab)}"
android:gravity="center"
android:text="List"
android:textAppearance="?android:textAppearanceMedium"
android:textSize="@{DataBindingFunctions.evaluateFactor(position, 0f, @dimen/text_tab_small, @dimen/text_tab_large)}"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/tab_1"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:setLayoutWeight="@{DataBindingFunctions.evaluateFactor(position, 0f, 3f, 4f)}"
/>
app:setLayoutWeight="@{
DataBindingFunctions.evaluateFactor(
position, ←スクロール位置(0.0〜3.0)
0f, ←対象タブの番号(0,1,2)
3f, ←未選択時のlayout_weight
4f ←選択時のlayout_weight
)}"
独自の補間用メソッド
独自のlayout_weight指定用メソッド(後述)
- 39. DroidKaigi 2017 - 2017/03/09 @cattaka_net
DataBindingの制限
●
LayoutParamに直接的に値を設定できない
●
xml上で android:layout_***** となっているもの
●
BindingAdapter用のメソッドを作ればできる
@BindingAdapter("setLayoutWeight")
public static void setLayoutWeight(View view, float value) {
ViewGroup.LayoutParams params = view.getLayoutParams();
if (params instanceof LinearLayout.LayoutParams) {
((LinearLayout.LayoutParams) params).weight = value;
view.setLayoutParams(params);
}
}
- 40. DroidKaigi 2017 - 2017/03/09 @cattaka_net
CollapsingToolbarLayout
みたいなことをやる
●
アイコンを動かす
●
テキストを動かす
●
ステータスバーの色を
変える
- 41. DroidKaigi 2017 - 2017/03/09 @cattaka_net
アイコンを動かす
<ImageView
android:id="@+id/image_icon"
android:layout_width="?android:actionBarSize"
android:layout_height="?android:actionBarSize"
android:background="@drawable/oval_fill_white"
android:padding="4dp"
android:scaleType="centerCrop"
android:scaleX="@{2f-scrollFactor}"
android:scaleY="@{2f-scrollFactor}"
app:layout_constraintBottom_toBottomOf="@+id/dummy_action_bar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/dummy_action_bar"
app:loadImage="@{item.file}"
app:loadImageTransformation="@{CircleTransform.instance}"
app:setLayoutMarginStart="@{(int)((1f-scrollFactor) * @dimen/icon_offset_x)}"
app:setLayoutMarginTop="@{(int)((1f-scrollFactor) * @dimen/icon_offset_y)}"
app:useFit="@{false}"
tools:layout_marginStart="@dimen/icon_offset_x"
tools:layout_marginTop="@dimen/icon_offset_y"
tools:scaleX="2"
tools:scaleY="2"
tools:src="@drawable/dummy_icon" />
- 42. DroidKaigi 2017 - 2017/03/09 @cattaka_net
アイコンを動かす
<ImageView
android:id="@+id/image_icon"
android:layout_width="?android:actionBarSize"
android:layout_height="?android:actionBarSize"
android:background="@drawable/oval_fill_white"
android:padding="4dp"
android:scaleType="centerCrop"
android:scaleX="@{2f-scrollFactor}"
android:scaleY="@{2f-scrollFactor}"
app:layout_constraintBottom_toBottomOf="@+id/dummy_action_bar"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/dummy_action_bar"
app:loadImage="@{item.file}"
app:loadImageTransformation="@{CircleTransform.instance}"
app:setLayoutMarginStart="@{(int)((1f-scrollFactor) * @dimen/icon_offset_x)}"
app:setLayoutMarginTop="@{(int)((1f-scrollFactor) * @dimen/icon_offset_y)}"
app:useFit="@{false}"
tools:layout_marginStart="@dimen/icon_offset_x"
tools:layout_marginTop="@dimen/icon_offset_y"
tools:scaleX="2"
tools:scaleY="2"
tools:src="@drawable/dummy_icon" />
android:scaleX="@{2f-scrollFactor}"
android:scaleY="@{2f-scrollFactor}"
app:setLayoutMarginStart="@{
(int)((1f-scrollFactor) * @dimen/icon_offset_x)
}"
app:setLayoutMarginTop="@{
(int)((1f-scrollFactor) * @dimen/icon_offset_y)
}"
- 43. DroidKaigi 2017 - 2017/03/09 @cattaka_net
テキストを動かす
<TextView
android:id="@+id/text_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@{item.name}"
android:textAppearance="?android:textAppearanceLarge"
android:textColor="@{DataBindingFunctions.evaluateColor(scrollFactor, @android:color/white, @android:color/black)}"
android:textSize="@{(1f-scrollFactor) * @dimen/text_title_large + scrollFactor * @dimen/text_title_small}"
app:layout_constraintBottom_toBottomOf="@+id/image_icon"
app:layout_constraintStart_toEndOf="@id/image_icon"
app:layout_constraintTop_toTopOf="@+id/image_icon"
app:setLayoutMarginStart="@{(int)((1f-scrollFactor) * @dimen/spacing_x4)}"
tools:layout_marginStart="@dimen/spacing_x4"
tools:text="Name"
tools:textColor="@android:color/white"
tools:textSize="@dimen/text_title_large" />
- 44. DroidKaigi 2017 - 2017/03/09 @cattaka_net
テキストを動かす
<TextView
android:id="@+id/text_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@{item.name}"
android:textAppearance="?android:textAppearanceLarge"
android:textColor="@{DataBindingFunctions.evaluateColor(scrollFactor, @android:color/white, @android:color/black)}"
android:textSize="@{(1f-scrollFactor) * @dimen/text_title_large + scrollFactor * @dimen/text_title_small}"
app:layout_constraintBottom_toBottomOf="@+id/image_icon"
app:layout_constraintStart_toEndOf="@id/image_icon"
app:layout_constraintTop_toTopOf="@+id/image_icon"
app:setLayoutMarginStart="@{(int)((1f-scrollFactor) * @dimen/spacing_x4)}"
tools:layout_marginStart="@dimen/spacing_x4"
tools:text="Name"
tools:textColor="@android:color/white"
tools:textSize="@dimen/text_title_large" />
android:textColor="@{
DataBindingFunctions.evaluateColor(
scrollFactor,
@android:color/white,
@android:color/black)
}"
android:textSize="@{
(1f-scrollFactor) * @dimen/text_title_large
+ scrollFactor * @dimen/text_title_small}"
app:setLayoutMarginStart="@{
(int)((1f-scrollFactor) * @dimen/spacing_x4)}"
- 45. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ステータスバーの色を変える
●
LOLLIPOP以降なら普通に変えられる
●
FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS
※:これはDataBinding使わない
int color = DataBindingFunctions.evaluateColor(
factor, mOriginalStatusBarColor, mVibrantColor);
Window window = getWindow();
if (window != null && Build.VERSION.SDK_INT
>= Build.VERSION_CODES.LOLLIPOP) {
window.setStatusBarColor(color);
}
- 47. DroidKaigi 2017 - 2017/03/09 @cattaka_net
toolsNSを活用しよう
●
layout xmlの最終形がイメージしづらい
●
レイアウトエディタ上でイメージできるようにしよう
- 48. DroidKaigi 2017 - 2017/03/09 @cattaka_net
表示が切れる問題
●
親のViewGroupを飛び出すと...
●
表示が切れる
●
elevationの影が切れる
●
android:clipToPadding="false" で回避できる
- 49. DroidKaigi 2017 - 2017/03/09 @cattaka_net
OnLayoutChangeListenerのtrap
●
気をつけないとループに嵌まることがある
●
変更通知→レイアウト変更→変更通知→...
●
フリーズはしないので知らないうちにCPUを食い潰す...
●
直前の値を保持して、不要ならメソッドを叩かない
ようにする
- 50. DroidKaigi 2017 - 2017/03/09 @cattaka_net
OnGlobalLayoutListenerのtrap
●
removeを忘れるとメモリリークする
- 51. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ConstraintLayoutが強力
●
LayoutParamを弄ると、相対的な配置を維持したまま
動く
●
layout_width
●
layout_height
●
layout_margin
●
layout_constraintHorizontal_weight
●
layout_constraintVertical_weight
●
etc
- 52. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ConstraintLayoutが強力
●
例
●
3つのテキストはアイコンに対
して相対的に動いている
- 53. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ConstraintLayoutのtrap
●
layout_width=0でmatch_parentと同じ挙動
●
100dp→0dpのように動かすと、
0dpのときに突然広がる挙動をして困る
●
BindingAdapterのメソッドの中で0.01などにして、
誤魔化用にすることで回避できる
●
ネガティブマージンが使えない問題
●
ダミーのSpaceを挟むことで回避できる
- 54. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ConstraintLayoutのtrap
●
Android Studio 2.3現在
レイアウトエディタでxmlを触ると
たまにxmlが壊れる(´;ω;`)
- 55. DroidKaigi 2017 - 2017/03/09 @cattaka_net
DataBindingは
暗黙的型変換をしない
●
計算でfloat, double, intの場合は明示的にキャス
トが必要
●
型が違っているとビルドエラーになる
●
Java言語の仕様に従って、floatなら1.0f、double
なら1.0とか書かないとダメ
- 57. DroidKaigi 2017 - 2017/03/09 @cattaka_net
DataBindingを使う理由
●
色や大きさはXMLに入れるべきか、Javaに入れるべきか
●
Javaに書くと
●
行数が増える
●
xmlと距離が遠くて把握しづらい
●
コードが読める人じゃないとメンテナンスできない
●
DataBindingに書くと
●
xmlの属性の@{...}の部分を見ればだいたいわかる
●
ただ、横に長くなる...
- 58. DroidKaigi 2017 - 2017/03/09 @cattaka_net
パフォーマンスに関する考察
●
LayoutParamsをいじるのは正直重い
●
LayoutParamsを変えると、measure系が走る
●
ただ複数のViewが相対的に変化するならどのみち必要
●
必要が無いならtranslateやscaleを使うほうが良
い
- 59. DroidKaigi 2017 - 2017/03/09 @cattaka_net
工数に関すること
●
極論で言うと、タッチイベントからやるのがパフォーマ
ンスが出る
●
CoordinatorLayoutと同じアプローチ
– すなわち、CoordinatorLayoutのBehaviorを作る
●
でも難解
●
イベント+DataBindingが楽(と考える)
操作イベント
属性値の計算
Viewの更新
Behaviorだと
これを全部やることになる...
- 61. DroidKaigi 2017 - 2017/03/09 @cattaka_net
まとめ
操作イベント
属性値の計算
Viewの更新
スクロールやレイアウトイベントを
トリガーにする
コード側で
値を正規化する
DataBindingで
具体的な値の算出と設定をする
- 62. DroidKaigi 2017 - 2017/03/09 @cattaka_net
サンプルアプリ
https://github.com/cattaka/ProteanLayoutExample
- 63. DroidKaigi 2017 - 2017/03/09 @cattaka_net
ご清聴ありがとうございました
Takao Sumitomo
@cattaka_net