Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Layout ファイルののメンテナンス

jsugai
June 19, 2017

Layout ファイルののメンテナンス

Umeda.apk #3 の登壇資料

jsugai

June 19, 2017
Tweet

More Decks by jsugai

Other Decks in Technology

Transcript

  1. Google Home $150 50 205 22 Google Pixel XL $600

    1 8 7 Google Home $122 14 87 6 Google Home $89
  2. 1. LinerLayout ᶄ 2. ImageView 4. TextView 5. TextView 3.

    LinerLayout Google Home $150 50 205 22 ᶄ ᶅ ᶆ 6. ImageView + TextView 7. ImageView + TextView 8. ImageView + TextView
  3. <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="@dimen/list_height"
 android:layout_marginTop="@dimen/small_padding_size"
 android:orientation="horizontal">


    
 <ImageView
 android:layout_width="@dimen/list_height"
 android:layout_height="@dimen/list_height"
 android:src="@mipmap/ic_launcher" />
 
 <LinearLayout
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:orientation="vertical"
 android:paddingStart="@dimen/text_paddng_right"
 tools:ignore="RtlSymmetry">
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:textSize="24sp"
 android:textStyle="bold"
 tools:text="Selected Item" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:textSize="20sp"
 tools:text="$200000" />
 
 <LinearLayout
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:orientation="horizontal"
 android:paddingStart="@dimen/small_padding_size"
 android:paddingTop="@dimen/small_padding_size">
 
 <ImageView
 android:layout_width="@dimen/small_icon_size"
 android:layout_height="@dimen/small_icon_size"
 android:src="@drawable/ic_comment_black_24dp" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 tools:text="item" />
 
 <ImageView
 android:layout_width="@dimen/small_icon_size"
 android:layout_height="@dimen/small_icon_size"
 android:src="@drawable/ic_thumb_up_black_24dp" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 tools:text="item" />
 
 <ImageView
 android:layout_width="@dimen/small_icon_size"
 android:layout_height="@dimen/small_icon_size"
 android:src="@drawable/ic_favorite_black_24dp" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 tools:text="item" />
 </LinearLayout>
 </LinearLayout>
 </LinearLayout> ௕͗͢ -JOF
  4. <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="@dimen/list_height"
 android:layout_marginTop="@dimen/small_padding_size"
 android:orientation="horizontal">


    
 <ImageView
 android:layout_width="@dimen/list_height"
 android:layout_height="@dimen/list_height"
 android:src="@mipmap/ic_launcher"
 />
 
 <LinearLayout
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:orientation="vertical"
 android:paddingStart="@dimen/text_paddng_right"
 tools:ignore="RtlSymmetry">
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:textSize="24sp"
 tools:text="Selected Item" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:textSize="20sp"
 tools:text="$200000" />
 
 <LinearLayout
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:orientation="horizontal"
 android:paddingStart="@dimen/small_padding_size"
 android:paddingTop="@dimen/small_padding_size">
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:paddingStart="@dimen/text_paddng_left"
 android:paddingEnd="@dimen/text_paddng_right"
 android:drawableStart="@drawable/ic_comment_black_24dp"
 tools:text="item" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:paddingStart="@dimen/text_paddng_left"
 android:paddingEnd="@dimen/text_paddng_right"
 android:drawableStart="@drawable/ic_thumb_up_black_24dp"
 tools:text="item" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:paddingStart="@dimen/text_paddng_left"
 android:paddingEnd="@dimen/text_paddng_right"
 android:drawableStart="@drawable/ic_favorite_black_24dp"
 tools:text="item" />
 </LinearLayout>
 </LinearLayout>
 </LinearLayout> -JOF 
  5. <?xml version="1.0" encoding="utf-8"?>
 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="@dimen/list_height"
 android:layout_marginTop="@dimen/small_padding_size"


    android:orientation="horizontal">
 
 <ImageView
 android:layout_width="@dimen/list_height"
 android:layout_height="@dimen/list_height"
 android:src="@mipmap/ic_launcher" />
 
 <com.google.android.flexbox.FlexboxLayout
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:orientation="vertical"
 android:paddingStart="@dimen/text_paddng_right"
 app:flexWrap="wrap">
 
 <TextView
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:textSize="24sp"
 android:textStyle="bold"
 tools:text="Selected Item" />
 
 <TextView
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:textSize="20sp"
 tools:text="$200000" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:drawableStart="@drawable/ic_comment_black_24dp"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 tools:text="item" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:drawableStart="@drawable/ic_thumb_up_black_24dp"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 tools:text="item" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:drawableStart="@drawable/ic_favorite_black_24dp"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 tools:text="item" />
 </com.google.android.flexbox.FlexboxLayout>
 </LinearLayout> -JOF  ʢωετΛݸݮʣ
  6. <?xml version="1.0" encoding="utf-8"?>
 <android.support.constraint.ConstraintLayout xmlns:android="http:// schemas.android.com/apk/res/android"
 xmlns:app="http://schemas.android.com/apk/res-auto"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="@dimen/list_height"


    android:layout_marginTop="@dimen/small_padding_size"
 android:orientation="horizontal">
 
 <ImageView
 android:id="@+id/imageView"
 android:layout_width="80dp"
 android:layout_height="80dp"
 android:src="@mipmap/ic_launcher"
 tools:layout_editor_absoluteY="0dp"
 android:layout_marginLeft="8dp"
 app:layout_constraintLeft_toLeftOf="parent" />
 
 <TextView
 android:layout_width="0dp"
 android:layout_height="wrap_content"
 android:layout_marginLeft="8dp"
 android:textSize="24sp"
 android:textStyle="bold"
 app:layout_constraintLeft_toRightOf="@+id/imageView"
 tools:layout_editor_absoluteY="0dp"
 tools:text="Selected Item" />
 
 <TextView
 android:layout_width="0dp"
 android:layout_height="wrap_content"
 android:layout_marginLeft="8dp"
 android:textSize="20sp"
 app:layout_constraintLeft_toRightOf="@+id/imageView"
 tools:layout_editor_absoluteY="28dp"
 tools:text="$200000" />
 
 <TextView
 android:id="@+id/textView"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_marginLeft="8dp"
 android:drawableStart="@drawable/ic_comment_black_24dp"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 app:layout_constraintLeft_toRightOf="@+id/imageView"
 tools:layout_editor_absoluteY="56dp"
 tools:text="item" />
 
 <TextView
 android:id="@+id/textView2"
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_marginLeft="8dp"
 android:drawableStart="@drawable/ic_thumb_up_black_24dp"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 app:layout_constraintLeft_toRightOf="@+id/textView"
 tools:layout_editor_absoluteY="56dp"
 tools:text="item" />
 
 <TextView
 android:layout_width="wrap_content"
 android:layout_height="wrap_content"
 android:layout_marginLeft="8dp"
 android:drawableStart="@drawable/ic_favorite_black_24dp"
 android:paddingEnd="@dimen/text_paddng_right"
 android:paddingStart="@dimen/text_paddng_left"
 app:layout_constraintLeft_toRightOf="@+id/textView2"
 tools:layout_editor_absoluteY="56dp"
 tools:text="item" />
 
 </android.support.constraint.ConstraintLayout> -JOF Ͱ΋ωετ͸Ұ൪গͳ͍
  7. @LayoutSpec
 public class ListItemSpec {
 
 @OnCreateLayout
 static ComponentLayout onCreateLayout(


    ComponentContext c,
 @Prop String name,
 @Prop String price,
 @Prop(optional = true) Drawable photo) {
 
 final ComponentLayout column = Column.create(c)
 .marginDip(YogaEdge.LEFT, 16)
 .child(
 Text.create(c)
 .text(name)
 .textSizeSp(24)
 )
 .child(
 Text.create(c)
 .text(price)
 .textSizeSp(16)
 )
 .child(
 Row.create(c)
 .marginDip(YogaEdge.TOP,4)
 .child(
 Image.create(c)
 .drawableRes(R.drawable.ic_comment)
 .withLayout()
 .marginDip(YogaEdge.RIGHT,4)
 .heightDip(20)
 .widthDip(20)
 )
 .child(
 Text.create(c)
 .text("700")
 .textSizeSp(14)
 )
 .child(
 Image.create(c)
 .drawableRes(R.drawable.ic_thumb_up)
 .withLayout()
 .marginDip(YogaEdge.RIGHT,4)
 ... ... ... ALL Programming
  8. Cons • ॻ͖׵͑Δͷ͕େม • αϯϓϧ௨Γʹॻ͍ͯ΋ಈ͔ͳ͍Օॴུ͕ • Ankoͷํ͕ͱ͖ͬͭ΍͍͢ • Fresco Λ࢝Ί

    FB ੡OSS໨നԡ͠ͷTutorial • ͪΐͬͱಠಛͳۭؾ Yoga ͸FB੡͕ͩผͷϥΠϒϥϦ (Glide ͱ͔ Picasso ͷํ͕)