adjust sport record UI
authorTrillGates <williamtrillgates@gmail.com>
Wed, 30 Jun 2021 02:22:44 +0000 (10:22 +0800)
committerTrillGates <williamtrillgates@gmail.com>
Wed, 30 Jun 2021 02:22:44 +0000 (10:22 +0800)
18 files changed:
app/src/main/java/com/ic/sport/adapter/PedRecordAdapter.java
app/src/main/java/com/ic/sport/fragment/pedometer/PedRecordFragment.java
app/src/main/java/com/ic/sport/widget/ring/RingProgress.java
app/src/main/res/layout/activity_pedometer.xml
app/src/main/res/layout/fragment_ped_main.xml
app/src/main/res/layout/fragment_ped_record.xml
app/src/main/res/layout/item_ped_record.xml
app/src/main/res/mipmap-mdpi/icon_arrow.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_calorie_big.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_calorie_small.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_height.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_line.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_step_green.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_step_white.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_target.png [new file with mode: 0644]
app/src/main/res/mipmap-mdpi/icon_weight.png [new file with mode: 0644]
app/src/main/res/values/colors.xml
app/src/main/res/values/styles.xml

index c48ce5b..a5d7df7 100644 (file)
@@ -20,12 +20,12 @@ public class PedRecordAdapter extends RecyclerView.Adapter<PedRecordAdapter.Reco
     private Context mContext;
     private List<RecordParcelable> mPedRecord;
 
-    public PedRecordAdapter(Context context){
+    public PedRecordAdapter(Context context) {
         this.mContext = context;
         this.mPedRecord = new ArrayList<>();
     }
 
-    public void updatePedRecordList(List<RecordParcelable> records){
+    public void updatePedRecordList(List<RecordParcelable> records) {
         mPedRecord.clear();
         mPedRecord.addAll(records);
         notifyDataSetChanged();
@@ -34,12 +34,14 @@ public class PedRecordAdapter extends RecyclerView.Adapter<PedRecordAdapter.Reco
     @NonNull
     @Override
     public RecordHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
-        return new RecordHolder(ItemPedRecordBinding.inflate(LayoutInflater.from(parent.getContext()), parent, false));
+        return new RecordHolder(ItemPedRecordBinding.
+                inflate(LayoutInflater.from(parent.getContext()),
+                        parent, false));
     }
 
     @Override
     public void onBindViewHolder(@NonNull RecordHolder holder, int position) {
-        holder.bindPedRecord(mContext,mPedRecord.get(position));
+        holder.bindPedRecord(mContext, mPedRecord.get(position));
     }
 
     @Override
@@ -55,20 +57,20 @@ public class PedRecordAdapter extends RecyclerView.Adapter<PedRecordAdapter.Reco
             binding = itemView;
         }
 
-        public void bindPedRecord(Context context,RecordParcelable entity) {
+        public void bindPedRecord(Context context, RecordParcelable entity) {
             if (binding == null || entity == null) {
                 return;
             }
 
-            binding.setTakingIcon(R.mipmap.step);
+            binding.setTakingIcon(R.mipmap.icon_step_green);
             binding.setTakingColor(Color.parseColor("#FFA500"));
             binding.setTakingUnit(context.getString(R.string.tips_target_unit));
 
-            binding.setCaloriesIcon(R.mipmap.calorie);
+            binding.setCaloriesIcon(R.mipmap.icon_calorie_small);
             binding.setCaloriesColor(Color.WHITE);
             binding.setCaloriesUnit(context.getString(R.string.tips_calories_unit));
 
-            binding.setDistanceIcon(R.mipmap.map);
+            binding.setDistanceIcon(R.mipmap.icon_line);
             binding.setDistanceColor(Color.WHITE);
             binding.setDistanceUnit(context.getString(R.string.tips_distance_unit));
 
index b7b0df8..e8a6746 100644 (file)
@@ -65,7 +65,8 @@ public class PedRecordFragment extends Fragment {
             public void getItemOffsets(@NonNull Rect outRect, @NonNull View view,
                                        @NonNull RecyclerView parent,
                                        @NonNull RecyclerView.State state) {
-                outRect.bottom = 10;
+                outRect.bottom = 2;
+                outRect.top = 2;
             }
         });
         initRecyclerView();
index bef0aec..cf7b472 100644 (file)
@@ -7,6 +7,7 @@ import android.annotation.SuppressLint;
 import android.content.Context;
 import android.content.res.TypedArray;
 import android.graphics.Bitmap;
+import android.graphics.BitmapFactory;
 import android.graphics.Canvas;
 import android.graphics.Color;
 import android.graphics.LinearGradient;
@@ -34,6 +35,7 @@ import com.ic.sport.util.AndroidUtils;
 public class RingProgress extends View {
     public boolean isDebug = true;
     private OnRingProgressInter onRingProgressInter;
+    private Bitmap topIcon;
 
     public interface OnRingProgressInter {
         void progress(float scaleProgress, float progress, float max);
@@ -59,7 +61,7 @@ public class RingProgress extends View {
     //圆环进度过度颜色
 //    private int ringProgressSecondColor;
     //开始角度
-    private int startAngle = -45;
+    private int startAngle = 0;
     //是否顺时针
     private boolean isClockwise = true;
     //当前进度
@@ -120,14 +122,14 @@ public class RingProgress extends View {
         TypedArray typedArray = getContext().obtainStyledAttributes(attrs, R.styleable.CircleProgress);
         neiYuanColor = typedArray.getColor(R.styleable.CircleProgress_neiYuanColor, getTransparentColor());
         ringRadius = (int) typedArray.getDimension(R.styleable.CircleProgress_ringRadius, -1);
-        ringWidth = (int) typedArray.getDimension(R.styleable.CircleProgress_ringWidth, 30);
+        ringWidth = (int) typedArray.getDimension(R.styleable.CircleProgress_ringWidth, 22);
         ringColor = typedArray.getColor(R.styleable.CircleProgress_ringColor,
                 ContextCompat.getColor(getContext(), R.color.top_color2));
         ringProgressColor = typedArray.getColor(R.styleable.CircleProgress_ringProgressColor,
                 ContextCompat.getColor(getContext(), R.color.green1));
-        startAngle = typedArray.getInteger(R.styleable.CircleProgress_startAngle, 135);
-        isClockwise = typedArray.getBoolean(R.styleable.CircleProgress_isClockwise, false);
-        progress = typedArray.getFloat(R.styleable.CircleProgress_progress, 10);
+        startAngle = typedArray.getInteger(R.styleable.CircleProgress_startAngle, -90);
+        isClockwise = typedArray.getBoolean(R.styleable.CircleProgress_isClockwise, true);
+        progress = typedArray.getFloat(R.styleable.CircleProgress_progress, 100);
         maxProgress = typedArray.getFloat(R.styleable.CircleProgress_maxProgress, 100);
 
         if (maxProgress <= 0) {
@@ -142,7 +144,7 @@ public class RingProgress extends View {
         scaleProgress = progress;
         viewProgress = progress * viewMax / maxProgress;
 
-        disableAngle = typedArray.getInteger(R.styleable.CircleProgress_disableAngle, 90);
+        disableAngle = typedArray.getInteger(R.styleable.CircleProgress_disableAngle, 0);
         isRound = typedArray.getBoolean(R.styleable.CircleProgress_isRound, true);
         useAnimation = typedArray.getBoolean(R.styleable.CircleProgress_useAnimation, true);
         duration = typedArray.getInteger(R.styleable.CircleProgress_duration, 1000);
@@ -152,7 +154,6 @@ public class RingProgress extends View {
         textColor = typedArray.getColor(R.styleable.CircleProgress_textColor, ContextCompat.getColor(getContext(), R.color.green1));
         textSize = (int) typedArray.getDimension(R.styleable.CircleProgress_textSize, getDef_TextSize());
         typedArray.recycle();
-//        initData();
     }
 
     private int getTransparentColor() {
@@ -180,6 +181,9 @@ public class RingProgress extends View {
         ringProgressColor = ContextCompat.getColor(getContext(), R.color.green1);
         textSize = dip2px(getContext(), 17);
         textColor = ContextCompat.getColor(getContext(), R.color.green1);
+        BitmapFactory.Options options = new BitmapFactory.Options();
+        options.inScaled = false;
+        topIcon = BitmapFactory.decodeResource(getResources(), R.mipmap.icon_arrow, options);
     }
 
     @Override
@@ -227,6 +231,14 @@ public class RingProgress extends View {
         if (isShowPercentText) {
             drawProgressText(canvas);
         }
+        //绘制顶部图标
+        drawTopIcon(canvas);
+    }
+
+    private void drawTopIcon(Canvas canvas) {
+        int left = centerX - topIcon.getWidth() / 2;
+        int top = centerY - topIcon.getHeight() / 2 - ringRadius;
+        canvas.drawBitmap(topIcon, left, top, mPaint);
     }
 
     private void drawProgressText(Canvas canvas) {
@@ -265,19 +277,6 @@ public class RingProgress extends View {
 
         RectF progressRectF = new RectF(centerX - ringRadius, centerY - ringRadius,
                 centerX + ringRadius, centerY + ringRadius);
-        LinearGradient linearGradient = new LinearGradient(progressRectF.left, progressRectF.top,
-                progressRectF.left, progressRectF.bottom,
-                new int[]{
-                        Color.parseColor("#33D9FF"),
-                        Color.parseColor("#1657D9")
-                }, new float[]{0f, 1f},
-                Shader.TileMode.CLAMP);
-        if (linearGradient != null) {
-            mPaint.setShader(linearGradient);
-        } else {
-            mPaint.setShader(null);
-        }
-
         if (isRound) {
             mPaint.setStrokeCap(Paint.Cap.ROUND);
         }
@@ -328,7 +327,7 @@ public class RingProgress extends View {
     }
 
     public void setProgress(float progress) {
-        setProgress(progress, useAnimation);
+        //setProgress(progress, useAnimation);
     }
 
     public int getDisableAngle() {
index f3c0bbf..005980c 100644 (file)
@@ -1,22 +1,42 @@
 <?xml version="1.0" encoding="utf-8"?>
 <FrameLayout 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:id="@+id/ped_root_id"
     android:layout_width="match_parent"
     android:layout_height="match_parent"
     tools:context=".PedometerActivity">
 
+    <TextView
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:padding="5dp"
+        android:text="@string/app_name"
+        android:textColor="@color/green1"
+        android:textSize="30sp"
+        android:textStyle="bold" />
+
+    <TextView
+        android:layout_width="wrap_content"
+        android:layout_height="wrap_content"
+        android:layout_gravity="right|top"
+        android:padding="5dp"
+        android:text="12:12"
+        android:textColor="@color/white"
+        android:textSize="30sp"
+        android:textStyle="bold" />
+
+
     <androidx.viewpager2.widget.ViewPager2
         android:id="@+id/ped_main_view_page"
         android:layout_width="match_parent"
-        android:layout_height="match_parent" />
+        android:layout_height="match_parent"
+        android:layout_marginTop="40dp"
+        android:layout_marginBottom="20dp" />
 
     <androidx.recyclerview.widget.RecyclerView
         android:id="@+id/ped_indicator_rv"
         android:layout_width="wrap_content"
         android:layout_height="wrap_content"
         android:layout_gravity="bottom|center_horizontal"
-        android:layout_marginBottom="5dp"
         android:overScrollMode="never" />
 </FrameLayout>
\ No newline at end of file
index bd91734..5e86a64 100644 (file)
             type="String" />
     </data>
 
-    <FrameLayout
+    <RelativeLayout
         android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:background="@mipmap/bg"
-        tools:context=".fragment.pedometer.PedMainFragment">
+        android:layout_height="match_parent">
 
         <com.ic.sport.widget.ring.RingProgress
             android:id="@+id/ring_progress"
             app:isShowPercentText="false"
             app:maxProgress="10000"
             app:neiYuanColor="@color/transparent"
-            app:progress="1000"
-            app:ringColor="@color/top_color2"
-            app:ringProgressColor="@color/blue_00"
-            app:ringWidth="30dp"
+            app:progress="6000"
             app:useAnimation="true" />
 
         <TextView
             android:id="@+id/ped_number_tv"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_gravity="center_horizontal"
-            android:layout_marginTop="130dp"
+            android:layout_centerInParent="true"
             android:includeFontPadding="false"
-            android:text="@{pedNumber}"
+            android:paddingBottom="20dp"
+            android:text="540"
             android:textColor="@color/white"
-            android:textSize="72sp" />
+            android:textSize="42sp" />
 
-        <TextView
-            android:id="@+id/ped_date_tv"
+        <ImageView
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_gravity="center_horizontal"
-            android:layout_marginTop="80dp"
-            android:text="@string/ped_main_today"
-            android:textColor="#FFFFFF"
-            android:textSize="36sp"
-            android:textStyle="bold" />
+            android:layout_above="@id/ped_number_tv"
+            android:layout_centerHorizontal="true"
+            android:layout_marginBottom="-10dp"
+            android:src="@mipmap/icon_step_white" />
 
         <TextView
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_gravity="center_horizontal|bottom"
-            android:layout_marginBottom="90dp"
+            android:layout_centerVertical="true"
+            android:layout_toRightOf="@id/ped_number_tv"
             android:includeFontPadding="false"
+            android:paddingBottom="10dp"
             android:text="@string/ped_main_step"
             android:textColor="@color/white"
-            android:textSize="36sp"
+            android:textSize="22sp"
             android:textStyle="bold" />
 
         <TextView
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_gravity="center_horizontal|bottom"
-            android:layout_marginBottom="32dp"
-            android:drawablePadding="1dp"
-            android:text="@{pedTarget}"
-
+            android:layout_alignParentBottom="true"
+            android:layout_centerHorizontal="true"
+            android:layout_marginBottom="60dp"
+            android:drawableTop="@mipmap/icon_calorie_small"
+            android:text="300.5 kcal"
             android:textColor="@color/white"
-            android:textSize="28sp"
+            android:textSize="20sp"
             android:textStyle="bold" />
-    </FrameLayout>
+        
+    </RelativeLayout>
 </layout>
\ No newline at end of file
index 34df0d6..7a29d49 100644 (file)
@@ -1,25 +1,12 @@
 <?xml version="1.0" encoding="utf-8"?>
-<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
+<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
     xmlns:tools="http://schemas.android.com/tools"
     android:layout_width="match_parent"
-    android:layout_height="match_parent"
-    android:background="@color/black"
-    android:gravity="center_horizontal"
-    android:orientation="vertical"
-    tools:context=".fragment.pedometer.PedRecordFragment">
-
-    <TextView
-        android:layout_width="wrap_content"
-        android:layout_height="wrap_content"
-        android:layout_marginTop="10dp"
-        android:text="@string/ped_record_name"
-        android:textColor="@color/main_text_color"
-        android:textSize="42sp" />
+    android:layout_height="match_parent">
 
     <androidx.recyclerview.widget.RecyclerView
         android:id="@+id/ped_record_rv"
         android:layout_width="match_parent"
-        android:layout_height="match_parent"
-        android:layout_marginBottom="20dp"
-        android:overScrollMode="never" />
-</LinearLayout>
\ No newline at end of file
+        android:layout_height="match_parent" />
+
+</FrameLayout>
\ No newline at end of file
index a693a73..9cdbe62 100644 (file)
 
     </data>
 
-    <LinearLayout
+    <RelativeLayout
         style="@style/Widget.MaterialComponents.CardView"
         android:layout_width="match_parent"
-        android:layout_height="wrap_content"
+        android:layout_height="80dp"
         android:background="@drawable/shape_bg"
-        android:orientation="vertical"
-        android:paddingTop="10dp"
-        android:paddingBottom="10dp"
-        app:cardBackgroundColor="#303233"
-        app:cardCornerRadius="5dp">
+        app:cardBackgroundColor="#1D1D1D"
+        app:cardCornerRadius="50dp">
 
         <TextView
             android:id="@+id/item_record_date"
             style="@style/RecordTextStyle"
-            android:layout_width="match_parent"
-            android:gravity="center_horizontal"
+            android:layout_marginLeft="10dp"
+            android:layout_marginTop="10dp"
             android:text="@{recordDate}"
             android:textColor="@color/white" />
 
@@ -82,7 +79,9 @@
             android:id="@+id/item_record_taking"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginLeft="30dp"
+            android:layout_alignParentBottom="true"
+            android:layout_marginLeft="10dp"
+            android:layout_marginBottom="5dp"
             icApp:widgetImageColor="@{takingColor}"
             icApp:widgetImageIcon="@{takingIcon}"
             icApp:widgetImageUnit="@{takingUnit}"
@@ -92,7 +91,9 @@
             android:id="@+id/item_record_calories"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginLeft="30dp"
+            android:layout_alignParentRight="true"
+            android:layout_marginTop="5dp"
+            android:layout_marginRight="10dp"
             icApp:widgetImageColor="@{caloriesColor}"
             icApp:widgetImageIcon="@{caloriesIcon}"
             icApp:widgetImageUnit="@{caloriesUnit}"
             android:id="@+id/item_record_distance"
             android:layout_width="wrap_content"
             android:layout_height="wrap_content"
-            android:layout_marginLeft="30dp"
+            android:layout_alignParentRight="true"
+            android:layout_alignParentBottom="true"
+            android:layout_marginRight="10dp"
+            android:layout_marginBottom="5dp"
             icApp:widgetImageColor="@{distanceColor}"
             icApp:widgetImageIcon="@{distanceIcon}"
             icApp:widgetImageUnit="@{distanceUnit}"
             icApp:widgetImageValue="@{recordDistance}" />
 
-    </LinearLayout>
+    </RelativeLayout>
 </layout>
diff --git a/app/src/main/res/mipmap-mdpi/icon_arrow.png b/app/src/main/res/mipmap-mdpi/icon_arrow.png
new file mode 100644 (file)
index 0000000..e345e97
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_arrow.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_calorie_big.png b/app/src/main/res/mipmap-mdpi/icon_calorie_big.png
new file mode 100644 (file)
index 0000000..487561e
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_calorie_big.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_calorie_small.png b/app/src/main/res/mipmap-mdpi/icon_calorie_small.png
new file mode 100644 (file)
index 0000000..b7dc16c
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_calorie_small.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_height.png b/app/src/main/res/mipmap-mdpi/icon_height.png
new file mode 100644 (file)
index 0000000..e131462
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_height.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_line.png b/app/src/main/res/mipmap-mdpi/icon_line.png
new file mode 100644 (file)
index 0000000..a1e01e8
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_line.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_step_green.png b/app/src/main/res/mipmap-mdpi/icon_step_green.png
new file mode 100644 (file)
index 0000000..48f7883
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_step_green.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_step_white.png b/app/src/main/res/mipmap-mdpi/icon_step_white.png
new file mode 100644 (file)
index 0000000..c966aae
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_step_white.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_target.png b/app/src/main/res/mipmap-mdpi/icon_target.png
new file mode 100644 (file)
index 0000000..ff599f0
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_target.png differ
diff --git a/app/src/main/res/mipmap-mdpi/icon_weight.png b/app/src/main/res/mipmap-mdpi/icon_weight.png
new file mode 100644 (file)
index 0000000..5f8ea8d
Binary files /dev/null and b/app/src/main/res/mipmap-mdpi/icon_weight.png differ
index 7ddcf69..535a4e2 100644 (file)
@@ -8,7 +8,7 @@
 
     <!-- 主题颜色-->
     <color name="top_color1">#20000000</color>
-    <color name="top_color2">#FFCECBCB</color>
+    <color name="top_color2">#111B01</color>
 
 
     <color name="gray_f6">#f6f6f6</color>
@@ -27,7 +27,7 @@
     <color name="gray_dd">#DDDDDD</color>
     <color name="green">#2DDB97</color>
     <color name="green_press">#FF20D18C</color>
-    <color name="green1">#34e8a6</color>
+    <color name="green1">#A0FE1E</color>
     <color name="green2">#22ddb0</color>
     <color name="green_qian">#E6F9F7</color>
     <color name="gray_ban">#50000000</color>
index fea0f48..8a45a43 100644 (file)
@@ -6,15 +6,15 @@
         <item name="colorPrimary">@color/colorPrimary</item>
         <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
         <item name="colorAccent">@color/colorAccent</item>
-        <item name="android:windowIsTranslucent">true</item>
-        <item name="android:windowBackground">@android:color/transparent</item>
+        <item name="android:windowBackground">@android:color/black</item>
     </style>
 
     <style name="RecordTextStyle">
         <item name="android:layout_width">wrap_content</item>
         <item name="android:layout_height">wrap_content</item>
         <item name="android:textColor">#FFFFFF</item>
-        <item name="android:textSize">30sp</item>
+        <item name="android:textSize">24sp</item>
+        <item name="android:textStyle">bold</item>
         <item name="android:includeFontPadding">false</item>
     </style>