[메인][Common] 리스티클 상세 페이지 구현

app/src/main/java/kr/co/zumo/app/lifeplus/view/custom/contents/CustomListicleImageView.java

@@ -7,6 +7,7 @@ import android.support.v7.widget.RecyclerView;
 import android.util.AttributeSet;
 import android.view.LayoutInflater;
 import android.view.MotionEvent;
+import android.widget.TextView;
 
 import java.util.List;
 
@@ -26,8 +27,13 @@ import kr.co.zumo.app.lifeplus.view.IEventListener;
  */
 public class CustomListicleImageView extends ConstraintLayout {
 
-  private CustomListicleImageViewAdapter adpater;
+  private CustomListicleImageViewAdapter adapter;
   private RecyclerView recyclerView;
+  private TextView textViewCurrentPage;
+  private TextView textViewTotalPage;
+  private TextView textViewTitleNumber;
+  private TextView textViewTitle;
+  private TextView textViewSubTitle;
 
   public CustomListicleImageView(Context context) {
     super(context);
@@ -45,14 +51,32 @@ public class CustomListicleImageView extends ConstraintLayout {
     LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
     inflater.inflate(R.layout.custom_listicle_image_view, this);
 
+    textViewCurrentPage = findViewById(R.id.text_view_current_page);
+    textViewTotalPage = findViewById(R.id.text_view_total_page);
+    textViewTitleNumber = findViewById(R.id.text_view_title_number);
+    textViewTitle = findViewById(R.id.text_view_title);
+    textViewSubTitle = findViewById(R.id.text_view_sub_title);
+
+
+    textViewTitleNumber.setText("05");
+    textViewTitle.setText("Title");
+    textViewSubTitle.setText("SubTitle");
+
+    textViewCurrentPage.setText("1");
+    textViewTotalPage.setText(String.valueOf(textImageBeanList.size()));
+
     recyclerView = findViewById(R.id.recycler_view_listicle_view);
-    recyclerView.setLayoutManager(new LinearLayoutManager(context, LinearLayoutManager.HORIZONTAL, false));
-    adpater = new CustomListicleImageViewAdapter(context, inflater, textImageBeanList, event -> {
+    LinearLayoutManager linearLayoutManager = new LinearLayoutManager(context, LinearLayoutManager.HORIZONTAL, false);
+    recyclerView.setLayoutManager(linearLayoutManager);
+    adapter = new CustomListicleImageViewAdapter(context, inflater, textImageBeanList, event -> {
       if (null != listener) {
+
+        listener.onEvent(event);
+
       }
     });
-    recyclerView.setAdapter(adpater);
 
+    recyclerView.setAdapter(adapter);
     recyclerView.addOnItemTouchListener(new RecyclerView.OnItemTouchListener() {
       @Override
       public boolean onInterceptTouchEvent(RecyclerView rv, MotionEvent e) {
@@ -78,7 +102,13 @@ public class CustomListicleImageView extends ConstraintLayout {
       }
     });
 
-
+    recyclerView.addOnScrollListener(new RecyclerView.OnScrollListener() {
+      @Override
+      public void onScrolled(RecyclerView recyclerView, int dx, int dy) {
+        textViewCurrentPage.setText(String.valueOf(linearLayoutManager.findFirstVisibleItemPosition() + 1));
+        //Log.e("APP#  CustomListicleImageView | onScrolled", "|" + linearLayoutManager.findFirstVisibleItemPosition());
+      }
+    });
   }
 
   public void dispose() {

app/src/main/java/kr/co/zumo/app/lifeplus/view/custom/contents/CustomListicleImageViewAdapter.java

@@ -48,7 +48,7 @@ public class CustomListicleImageViewAdapter extends RecyclerView.Adapter<CustomL
   public void onBindViewHolder(@NonNull CustomListicleImageViewHolder holder, int position) {
     holder.bind(textImageBeanList.get(position), event -> {
       if(null != listener) {
-        //listener.onEvent(event);
+        listener.onEvent(event);
       }
     });
   }

app/src/main/java/kr/co/zumo/app/lifeplus/view/custom/contents/CustomListicleImageViewHolder.java

@@ -3,10 +3,10 @@ package kr.co.zumo.app.lifeplus.view.custom.contents;
 import android.support.v7.widget.RecyclerView;
 import android.view.View;
 import android.widget.ImageView;
-import android.widget.TextView;
 
 import kr.co.zumo.app.R;
 import kr.co.zumo.app.lifeplus.bean.TextImageBean;
+import kr.co.zumo.app.lifeplus.view.Event;
 import kr.co.zumo.app.lifeplus.view.IEventListener;
 
 /**
@@ -22,29 +22,18 @@ import kr.co.zumo.app.lifeplus.view.IEventListener;
 public class CustomListicleImageViewHolder extends RecyclerView.ViewHolder {
 
   private ImageView imageViewBackground;
-  private TextView textViewTitleNumber;
-  private TextView textViewTitle;
-  private TextView textViewSubTitle;
-  private TextView textViewCurrentPage;
-  private TextView textViewTotalPage;
+
 
 
   public CustomListicleImageViewHolder(View itemView) {
     super(itemView);
     imageViewBackground = itemView.findViewById(R.id.image_view_background);
-    textViewTitleNumber = itemView.findViewById(R.id.text_view_title_number);
-    textViewTitle = itemView.findViewById(R.id.text_view_title);
-    textViewSubTitle = itemView.findViewById(R.id.text_view_sub_title);
-    textViewCurrentPage = itemView.findViewById(R.id.text_view_current_page);
-    textViewTotalPage = itemView.findViewById(R.id.text_view_total_page);
   }
 
   public void bind(TextImageBean bean, IEventListener listener) {
     // TODO: 일단 dummy로 구현..
     imageViewBackground.setImageResource(bean.getImageResource());
-    textViewTitleNumber.setText("05");
-    textViewTitle.setText(bean.getTextResource());
-    textViewSubTitle.setText("대문샷을 부르는 감각적인 로스팅 팩토리");
+    listener.onEvent(new Event.Builder(Event.DETAIL).index(getAdapterPosition()).build());
   }
 
   public void dispose() {

app/src/main/java/kr/co/zumo/app/lifeplus/view/screen/contents/ContentsDetailListicleDetailViewHolder.java

@@ -33,6 +33,7 @@ public class ContentsDetailListicleDetailViewHolder extends ContentsDetailView {
     super(itemView);
     customListicleImageView = itemView.findViewById(R.id.custom_listicle_image_view);
     layoutContainer = itemView.findViewById(R.id.layout_container);
+
   }
 
   @Override
@@ -43,16 +44,19 @@ public class ContentsDetailListicleDetailViewHolder extends ContentsDetailView {
     textImageBeans.add(new TextImageBean(R.drawable.img_bestbucket_banner_1, R.string.life_plus));
     textImageBeans.add(new TextImageBean(R.drawable.img_bestbucket_banner_1, R.string.life_plus));
     textImageBeans.add(new TextImageBean(R.drawable.img_bestbucket_banner_1, R.string.life_plus));
+
     customListicleImageView.init(itemView.getContext(), textImageBeans, new IEventListener() {
       @Override
       public void onEvent(Event event) {
       }
     });
 
+
     for (int i = 0; i < 20; i++) {
-      CustomListicleInformationView informationView = new CustomListicleInformationView(itemView.getContext(), String.valueOf(i)+".", "description");
+      CustomListicleInformationView informationView = new CustomListicleInformationView(itemView.getContext(), String.valueOf(i) + ".", "description");
       layoutContainer.addView(informationView);
     }
+
   }
 
   @Override

app/src/main/res/layout/contents_listicle_detail.xml

@@ -15,6 +15,8 @@
     app:layout_constraintStart_toStartOf="parent"
     app:layout_constraintTop_toTopOf="parent"/>
 
+
+
   <ScrollView
     android:id="@+id/scroll_view"
     android:layout_width="match_parent"
@@ -23,16 +25,16 @@
     android:layout_marginTop="25dp"
     android:layout_marginEnd="25dp"
     android:orientation="vertical"
+    app:layout_constraintBottom_toBottomOf="parent"
     app:layout_constraintEnd_toEndOf="parent"
     app:layout_constraintStart_toStartOf="parent"
-    app:layout_constraintBottom_toBottomOf="parent"
     app:layout_constraintTop_toBottomOf="@+id/custom_listicle_image_view">
 
     <LinearLayout
-      android:orientation="vertical"
       android:id="@+id/layout_container"
       android:layout_width="match_parent"
-      android:layout_height="match_parent">
+      android:layout_height="match_parent"
+      android:orientation="vertical">
 
     </LinearLayout>
 

app/src/main/res/layout/custom_listicle_image_view.xml

@@ -1,14 +1,138 @@
 <?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="match_parent">
 
   <android.support.v7.widget.RecyclerView
-    android:orientation="horizontal"
     android:id="@+id/recycler_view_listicle_view"
     android:layout_width="match_parent"
-    android:layout_height="match_parent">
+    android:layout_height="match_parent"
+    android:orientation="horizontal">
 
   </android.support.v7.widget.RecyclerView>
+
+  <android.support.constraint.ConstraintLayout
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginStart="25dp"
+    android:layout_marginTop="19dp"
+    android:layout_marginBottom="16dp"
+    app:layout_constraintBottom_toBottomOf="parent"
+    app:layout_constraintStart_toStartOf="parent"
+    tools:background="@color/CD0D0D0">
+
+    <ImageView
+      android:id="@+id/image_view_pre_page"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:paddingEnd="7dp"
+      app:layout_constraintBottom_toBottomOf="@id/text_view_current_page"
+      app:layout_constraintEnd_toStartOf="@+id/text_view_current_page"
+      app:layout_constraintHorizontal_bias="0.5"
+      app:layout_constraintStart_toStartOf="parent"
+      app:layout_constraintTop_toTopOf="@+id/text_view_current_page"
+      app:srcCompat="@drawable/ic_page_prev"/>
+
+    <TextView
+      android:id="@+id/text_view_current_page"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:lineSpacingExtra="4dp"
+      android:textColor="@color/CFFFFFF"
+      android:textSize="12dp"
+      app:layout_constraintEnd_toStartOf="@+id/slash"
+      app:layout_constraintHorizontal_bias="0.5"
+      app:layout_constraintStart_toEndOf="@+id/image_view_pre_page"
+      tools:text="1"/>
+
+    <TextView
+      android:id="@+id/slash"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:lineSpacingExtra="4dp"
+      android:text=" / "
+      android:textColor="@color/CFFFFFF"
+      android:textSize="12dp"
+      app:layout_constraintEnd_toStartOf="@+id/text_view_total_page"
+      app:layout_constraintHorizontal_bias="0.5"
+      app:layout_constraintStart_toEndOf="@+id/text_view_current_page"/>
+
+    <TextView
+      android:id="@+id/text_view_total_page"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:lineSpacingExtra="4dp"
+      android:textColor="@color/CFFFFFF"
+      android:textSize="12dp"
+      app:layout_constraintEnd_toStartOf="@+id/image_view_next_page"
+      app:layout_constraintHorizontal_bias="0.5"
+      app:layout_constraintStart_toEndOf="@+id/slash"
+      tools:text="1"/>
+
+    <ImageView
+      android:id="@+id/image_view_next_page"
+      android:layout_width="wrap_content"
+      android:layout_height="wrap_content"
+      android:paddingStart="7dp"
+      app:layout_constraintBottom_toBottomOf="@+id/text_view_total_page"
+      app:layout_constraintEnd_toEndOf="parent"
+      app:layout_constraintStart_toEndOf="@+id/text_view_total_page"
+      app:layout_constraintTop_toTopOf="@+id/text_view_total_page"
+      app:srcCompat="@drawable/ic_page_next"/>
+  </android.support.constraint.ConstraintLayout>
+
+  <TextView
+    android:id="@+id/text_view_title_number"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginStart="25dp"
+    android:layout_marginBottom="110dp"
+    android:gravity="center_horizontal"
+    android:lineSpacingExtra="7dp"
+    android:textColor="@color/CFFFFFF"
+    android:textSize="26dp"
+    app:layout_constraintBottom_toBottomOf="parent"
+    app:layout_constraintStart_toStartOf="parent"
+    tools:text="05"
+    tools:textColor="@color/C000000"/>
+
+  <ImageView
+    android:id="@+id/oval"
+    android:layout_width="7dp"
+    android:layout_height="7dp"
+    android:layout_marginStart="4dp"
+    android:layout_marginTop="13dp"
+    android:src="@drawable/oval_cffffff"
+    app:layout_constraintBottom_toBottomOf="@id/text_view_title_number"
+    app:layout_constraintStart_toEndOf="@+id/text_view_title_number"
+    app:layout_constraintTop_toTopOf="@id/text_view_title_number"/>
+
+  <TextView
+    android:id="@+id/text_view_title"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginTop="17dp"
+    android:lineSpacingExtra="7dp"
+    android:textColor="@color/CFFFFFF"
+    android:textSize="18dp"
+    app:layout_constraintStart_toStartOf="@+id/text_view_title_number"
+    app:layout_constraintTop_toBottomOf="@+id/text_view_title_number"
+    tools:text="진주, 로스팅웨어"
+    tools:textColor="@color/C000000"/>
+
+  <TextView
+    android:id="@+id/text_view_sub_title"
+    android:layout_width="wrap_content"
+    android:layout_height="wrap_content"
+    android:layout_marginTop="4dp"
+    android:lineSpacingExtra="4dp"
+    android:textColor="@color/CFFFFFF"
+    android:textSize="12sp"
+    app:layout_constraintStart_toStartOf="@+id/text_view_title"
+    app:layout_constraintTop_toBottomOf="@+id/text_view_title"
+    tools:text="대문샷을 부르는 감각적인 로스팅 팩토리"
+    tools:textColor="@color/C000000"/>
 </android.support.constraint.ConstraintLayout>

app/src/main/res/layout/custom_listicle_image_view_item.xml

@@ -13,120 +13,5 @@
     android:scaleType="centerCrop"
     android:src="@color/C666666"/>
 
-  <TextView
-    android:id="@+id/text_view_title_number"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:layout_marginStart="25dp"
-    android:layout_marginBottom="110dp"
-    android:gravity="center_horizontal"
-    android:lineSpacingExtra="7dp"
-    android:textColor="@color/CFFFFFF"
-    android:textSize="26dp"
-    app:layout_constraintBottom_toBottomOf="parent"
-    app:layout_constraintStart_toStartOf="parent"
-    tools:text="05"/>
 
-  <ImageView
-    android:id="@+id/oval"
-    android:layout_width="7dp"
-    android:layout_height="7dp"
-    android:layout_marginStart="4dp"
-    android:layout_marginTop="13dp"
-    android:src="@drawable/oval_cffffff"
-    app:layout_constraintBottom_toBottomOf="@id/text_view_title_number"
-    app:layout_constraintStart_toEndOf="@+id/text_view_title_number"
-    app:layout_constraintTop_toTopOf="@id/text_view_title_number"/>
-
-  <TextView
-    android:id="@+id/text_view_title"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:layout_marginTop="17dp"
-    android:lineSpacingExtra="7dp"
-    android:textColor="@color/CFFFFFF"
-    android:textSize="18dp"
-    app:layout_constraintStart_toStartOf="@+id/text_view_title_number"
-    app:layout_constraintTop_toBottomOf="@+id/text_view_title_number"
-    tools:text="진주, 로스팅웨어"/>
-
-  <TextView
-    android:id="@+id/text_view_sub_title"
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:layout_marginTop="4dp"
-    android:lineSpacingExtra="4dp"
-    android:textColor="@color/CFFFFFF"
-    android:textSize="12sp"
-    app:layout_constraintStart_toStartOf="@+id/text_view_title"
-    app:layout_constraintTop_toBottomOf="@+id/text_view_title"
-    tools:text="대문샷을 부르는 감각적인 로스팅 팩토리"/>
-
-  <android.support.constraint.ConstraintLayout
-    android:layout_width="wrap_content"
-    android:layout_height="wrap_content"
-    android:layout_marginStart="25dp"
-    android:layout_marginTop="19dp"
-    app:layout_constraintStart_toStartOf="parent"
-    app:layout_constraintTop_toBottomOf="@+id/text_view_sub_title">
-
-    <ImageView
-      android:id="@+id/image_view_pre_page"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:paddingEnd="7dp"
-      app:layout_constraintBottom_toBottomOf="@id/text_view_current_page"
-      app:layout_constraintEnd_toStartOf="@+id/text_view_current_page"
-      app:layout_constraintHorizontal_bias="0.5"
-      app:layout_constraintStart_toStartOf="parent"
-      app:layout_constraintTop_toTopOf="@+id/text_view_current_page"
-      app:srcCompat="@drawable/ic_page_prev"/>
-
-    <TextView
-      android:id="@+id/text_view_current_page"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:lineSpacingExtra="4dp"
-      android:textColor="@color/CFFFFFF"
-      android:textSize="12dp"
-      app:layout_constraintEnd_toStartOf="@+id/slash"
-      app:layout_constraintHorizontal_bias="0.5"
-      app:layout_constraintStart_toEndOf="@+id/image_view_pre_page"
-      tools:text="1"/>
-
-    <TextView
-      android:id="@+id/slash"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:lineSpacingExtra="4dp"
-      android:textColor="@color/CFFFFFF"
-      android:textSize="12dp"
-      app:layout_constraintEnd_toStartOf="@+id/text_view_total_page"
-      app:layout_constraintHorizontal_bias="0.5"
-      app:layout_constraintStart_toEndOf="@+id/text_view_current_page"
-      tools:text=" / "/>
-
-    <TextView
-      android:id="@+id/text_view_total_page"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:lineSpacingExtra="4dp"
-      android:textColor="@color/CFFFFFF"
-      android:textSize="12dp"
-      app:layout_constraintEnd_toStartOf="@+id/image_view_next_page"
-      app:layout_constraintHorizontal_bias="0.5"
-      app:layout_constraintStart_toEndOf="@+id/slash"
-      tools:text="1"/>
-
-    <ImageView
-      android:id="@+id/image_view_next_page"
-      android:layout_width="wrap_content"
-      android:layout_height="wrap_content"
-      android:paddingStart="7dp"
-      app:layout_constraintBottom_toBottomOf="@+id/text_view_total_page"
-      app:layout_constraintEnd_toEndOf="parent"
-      app:layout_constraintStart_toEndOf="@+id/text_view_total_page"
-      app:layout_constraintTop_toTopOf="@+id/text_view_total_page"
-      app:srcCompat="@drawable/ic_page_next"/>
-  </android.support.constraint.ConstraintLayout>
 </android.support.constraint.ConstraintLayout>