230和272弧形列表优化 2495/2 2495/head 2496/target/1
authorluozheng <1732036298@qq.com>
Mon, 13 Oct 2025 09:25:52 +0000 (17:25 +0800)
committerluozheng <1732036298@qq.com>
Mon, 13 Oct 2025 09:25:52 +0000 (17:25 +0800)
code/sdk/application/wearable/fd230/nativeapp/nativeui/applist/src/AppItemView.cpp
code/sdk/application/wearable/fd230/nativeapp/nativeui/applist/src/ApplistView.cpp
code/sdk/application/wearable/fd272/nativeapp/nativeui/applist/src/AppItemView.cpp
code/sdk/application/wearable/fd272/nativeapp/nativeui/applist/src/ApplistView.cpp

index fbe5b16..4b6fa81 100644 (file)
@@ -135,10 +135,10 @@ namespace OHOS {
         return itemInfo_.uid;
     }
     /* ---------------------------------- 弧形列表 ---------------------------------- */
-    #define ARC_SCALE_LIST_ITEM_WIDTH (400)
-    #define ARC_SCALE_LIST_ITEM_HEIGHT (110) 
+    #define ARC_SCALE_LIST_ITEM_WIDTH (440)
+    #define ARC_SCALE_LIST_ITEM_HEIGHT (120) 
     
-    #define ARC_SCALE_LIST_IMAGE_X (0)
+    #define ARC_SCALE_LIST_IMAGE_X (20)
     #define ARC_SCALE_LIST_IMAGE_WIDTH  (ARC_SCALE_LIST_ITEM_HEIGHT - 10)
     #define ARC_SCALE_LIST_IMAGE_HEIGHT (ARC_SCALE_LIST_ITEM_HEIGHT - 10)
     #define ARC_SCALE_LIST_IMAGE_Y ((ARC_SCALE_LIST_ITEM_HEIGHT - ARC_SCALE_LIST_IMAGE_HEIGHT) / 2)
@@ -151,7 +151,9 @@ namespace OHOS {
     ArcScaleListItemView::ArcScaleListItemView()
     {
         Resize(ARC_SCALE_LIST_ITEM_WIDTH, ARC_SCALE_LIST_ITEM_HEIGHT);
-        SetStyle(STYLE_BACKGROUND_OPA, OPA_TRANSPARENT);
+        SetStyle(STYLE_BACKGROUND_OPA, OPA_OPAQUE);
+        SetStyle(STYLE_BACKGROUND_COLOR, 0xff191919);
+        SetStyle(STYLE_BORDER_RADIUS, 100); // 胶囊形状
         SetTouchable(true);
         SetUpChild();
     }
index ee597d9..2442348 100644 (file)
@@ -204,12 +204,13 @@ void ApplistView::WaterfallStyleOnStart()
 }
 /* -------------------------------------------------------------------------- */
 /* ---------------------------------- 弧形列表 ---------------------------------- */
-#define ARC_SCALE_LIST_SCALE_FACTOR (400)
-#define ARC_SCALE_LIST_X (25)
+#define ARC_SCALE_LIST_SCALE_FACTOR (440)
+#define ARC_SCALE_LIST_X (13)
 #define ARC_SCALE_LIST_Y (0)
 #define ARC_SCALE_LIST_WIDTH (Screen::GetInstance().GetWidth() - ARC_SCALE_LIST_X)
 #define ARC_SCALE_LIST_HEIGHT (Screen::GetInstance().GetHeight())
 
+#if 1
 /**
  * @brief 根据位置变换列表项的基础函数
  * 
@@ -260,6 +261,57 @@ static bool TransformItemBaseOnPosition(UITransformList* list, UIView* item)
     // 如果列表项不在列表的中心区域,返回 false
     return false;
 }
+#else
+static bool TransformItemBaseOnPosition(UITransformList* list, UIView* item)
+{
+    if (list == nullptr || item == nullptr) return false;
+    if (item->GetViewType() != UI_TRANSFORM_GROUP) return false;
+
+    UITransformGroup* group = dynamic_cast<UITransformGroup*>(item);
+    if (group == nullptr) return false;
+
+    const int16_t w = group->GetWidth();
+    const int16_t h = group->GetHeight();
+    if (list->GetDirection() != UIList::VERTICAL) return false;
+
+    const int16_t midY = list->GetY() + (list->GetHeight() >> 1);
+    const int16_t y    = group->GetY();
+    const int offset   = (y + (h >> 1) - midY); // 距中心偏移(+向下)
+
+    // 1) 缩放(中心最大,远离越小)
+    // 基于现有 SineEaseIn,收敛更柔和;scale ∈ [minScale, 1.0]
+    static constexpr float kMinScale = 0.90f;            // 两侧最小缩放
+    static constexpr int   kScaleMax = ARC_SCALE_LIST_SCALE_FACTOR; // 400
+    const int eased = EasingEquation::SineEaseIn(0, kScaleMax, MATH_ABS(offset), kScaleMax);
+    float scale = 1.0f - (static_cast<float>(eased) / kScaleMax);
+    if (scale < kMinScale) scale = kMinScale;
+
+    // 2) 弧形位移(根据距中心的距离决定向右偏移,模拟圆弧)
+    // 简化:xShift 与 (1 - scale) 成正比;可根据视觉微调 kMaxXShift
+    static constexpr int16_t kMaxXShift = 40;            // 两端最大右移像素
+    const int16_t xShift = static_cast<int16_t>(kMaxXShift * (1.0f - scale));
+
+    // 3) 应用变换:先重置再设置,避免累计误差;以靠右的枢轴点缩放(让左侧圆图标更稳)
+    group->Scale(Vector2<float>(scale, scale), Vector2<float>(w * 0.75f, h * 0.5f));
+
+    // 4) UITransformGroup 支持平移变换(不改布局,仅视觉位移)
+    group->Translate(Vector2<int16_t>(xShift, 0));
+
+    // 5) 居中项高亮(胶囊背景 + 文字白色,非中心透明 + 灰字)
+    const bool isCenter = (y <= midY) && ((y + h) >= midY);
+
+    // 访问子控件,改样式
+    ArcScaleListItemView* arcItem = dynamic_cast<ArcScaleListItemView*>(group);
+    if (arcItem != nullptr) {
+        UILabelExt*  label = arcItem->GetLabel();
+        if (label) {
+            label->SetTextColor(isCenter ? Color::White() : Color::Gray());
+        }
+    }
+
+    return isCenter;
+}
+#endif
 
 void ApplistView::ArcScaleListStyleOnStart(void)
 {
@@ -295,13 +347,15 @@ void ApplistView::ArcScaleListStyleOnStart(void)
         ArcScaleList_->SetDraggable(true);
         ArcScaleList_->SetThrowDrag(true);
         ArcScaleList_->SetStyle(STYLE_BACKGROUND_OPA, OPA_TRANSPARENT);
-        ArcScaleList_->SetScrollBlankSize(10);//(50);
+        // 让首尾元素也能滑动到屏幕中线处:在顶部/底部各预留半屏的空白区
+        ArcScaleList_->SetScrollBlankSize(Screen::GetInstance().GetHeight() / 2, UIAbstractScroll::Direction::TOP);
+        ArcScaleList_->SetScrollBlankSize(Screen::GetInstance().GetHeight() / 2, UIAbstractScroll::Direction::BOTTOM);
         ArcScaleList_->SetMaxScrollDistance(MAX_SCROLL_DIS);
         ArcScaleList_->SetYScrollBarVisible(true);
         // ArcScaleList_->SetScrollStateListener(presenter_);
         ArcScaleList_->SetReboundSize(5);
         ArcScaleList_->EnableAutoAlign(true);
-        ArcScaleList_->SetItemSpace(0);
+        ArcScaleList_->SetItemSpace(20);
         ArcScaleList_->SetSelectPosition(ARC_SCALE_LIST_HEIGHT / 2);
         ArcScaleList_->SetRotateFactor(1.0);
         ArcScaleList_->RequestFocus();
@@ -341,8 +395,8 @@ void ApplistView::ArcScaleListStyleOnSetUpView(void)
             headY = presenter_->GetArcListHeadItemY();
         }
         if (headY == 0) { 
-            // headY = VERTICAL_RESOLUTION / NUM_2;
-            headY = -42;
+            headY = VERTICAL_RESOLUTION / NUM_2;
+            // headY = -42;
         }
     }
     WEARABLE_LOGD(WEARABLE_LOG_MODULE_APP, "[%d],startIndex = %d,headY = %d", __LINE__,startIndex,headY);
index fbe5b16..4b6fa81 100644 (file)
@@ -135,10 +135,10 @@ namespace OHOS {
         return itemInfo_.uid;
     }
     /* ---------------------------------- 弧形列表 ---------------------------------- */
-    #define ARC_SCALE_LIST_ITEM_WIDTH (400)
-    #define ARC_SCALE_LIST_ITEM_HEIGHT (110) 
+    #define ARC_SCALE_LIST_ITEM_WIDTH (440)
+    #define ARC_SCALE_LIST_ITEM_HEIGHT (120) 
     
-    #define ARC_SCALE_LIST_IMAGE_X (0)
+    #define ARC_SCALE_LIST_IMAGE_X (20)
     #define ARC_SCALE_LIST_IMAGE_WIDTH  (ARC_SCALE_LIST_ITEM_HEIGHT - 10)
     #define ARC_SCALE_LIST_IMAGE_HEIGHT (ARC_SCALE_LIST_ITEM_HEIGHT - 10)
     #define ARC_SCALE_LIST_IMAGE_Y ((ARC_SCALE_LIST_ITEM_HEIGHT - ARC_SCALE_LIST_IMAGE_HEIGHT) / 2)
@@ -151,7 +151,9 @@ namespace OHOS {
     ArcScaleListItemView::ArcScaleListItemView()
     {
         Resize(ARC_SCALE_LIST_ITEM_WIDTH, ARC_SCALE_LIST_ITEM_HEIGHT);
-        SetStyle(STYLE_BACKGROUND_OPA, OPA_TRANSPARENT);
+        SetStyle(STYLE_BACKGROUND_OPA, OPA_OPAQUE);
+        SetStyle(STYLE_BACKGROUND_COLOR, 0xff191919);
+        SetStyle(STYLE_BORDER_RADIUS, 100); // 胶囊形状
         SetTouchable(true);
         SetUpChild();
     }
index ee597d9..2442348 100644 (file)
@@ -204,12 +204,13 @@ void ApplistView::WaterfallStyleOnStart()
 }
 /* -------------------------------------------------------------------------- */
 /* ---------------------------------- 弧形列表 ---------------------------------- */
-#define ARC_SCALE_LIST_SCALE_FACTOR (400)
-#define ARC_SCALE_LIST_X (25)
+#define ARC_SCALE_LIST_SCALE_FACTOR (440)
+#define ARC_SCALE_LIST_X (13)
 #define ARC_SCALE_LIST_Y (0)
 #define ARC_SCALE_LIST_WIDTH (Screen::GetInstance().GetWidth() - ARC_SCALE_LIST_X)
 #define ARC_SCALE_LIST_HEIGHT (Screen::GetInstance().GetHeight())
 
+#if 1
 /**
  * @brief 根据位置变换列表项的基础函数
  * 
@@ -260,6 +261,57 @@ static bool TransformItemBaseOnPosition(UITransformList* list, UIView* item)
     // 如果列表项不在列表的中心区域,返回 false
     return false;
 }
+#else
+static bool TransformItemBaseOnPosition(UITransformList* list, UIView* item)
+{
+    if (list == nullptr || item == nullptr) return false;
+    if (item->GetViewType() != UI_TRANSFORM_GROUP) return false;
+
+    UITransformGroup* group = dynamic_cast<UITransformGroup*>(item);
+    if (group == nullptr) return false;
+
+    const int16_t w = group->GetWidth();
+    const int16_t h = group->GetHeight();
+    if (list->GetDirection() != UIList::VERTICAL) return false;
+
+    const int16_t midY = list->GetY() + (list->GetHeight() >> 1);
+    const int16_t y    = group->GetY();
+    const int offset   = (y + (h >> 1) - midY); // 距中心偏移(+向下)
+
+    // 1) 缩放(中心最大,远离越小)
+    // 基于现有 SineEaseIn,收敛更柔和;scale ∈ [minScale, 1.0]
+    static constexpr float kMinScale = 0.90f;            // 两侧最小缩放
+    static constexpr int   kScaleMax = ARC_SCALE_LIST_SCALE_FACTOR; // 400
+    const int eased = EasingEquation::SineEaseIn(0, kScaleMax, MATH_ABS(offset), kScaleMax);
+    float scale = 1.0f - (static_cast<float>(eased) / kScaleMax);
+    if (scale < kMinScale) scale = kMinScale;
+
+    // 2) 弧形位移(根据距中心的距离决定向右偏移,模拟圆弧)
+    // 简化:xShift 与 (1 - scale) 成正比;可根据视觉微调 kMaxXShift
+    static constexpr int16_t kMaxXShift = 40;            // 两端最大右移像素
+    const int16_t xShift = static_cast<int16_t>(kMaxXShift * (1.0f - scale));
+
+    // 3) 应用变换:先重置再设置,避免累计误差;以靠右的枢轴点缩放(让左侧圆图标更稳)
+    group->Scale(Vector2<float>(scale, scale), Vector2<float>(w * 0.75f, h * 0.5f));
+
+    // 4) UITransformGroup 支持平移变换(不改布局,仅视觉位移)
+    group->Translate(Vector2<int16_t>(xShift, 0));
+
+    // 5) 居中项高亮(胶囊背景 + 文字白色,非中心透明 + 灰字)
+    const bool isCenter = (y <= midY) && ((y + h) >= midY);
+
+    // 访问子控件,改样式
+    ArcScaleListItemView* arcItem = dynamic_cast<ArcScaleListItemView*>(group);
+    if (arcItem != nullptr) {
+        UILabelExt*  label = arcItem->GetLabel();
+        if (label) {
+            label->SetTextColor(isCenter ? Color::White() : Color::Gray());
+        }
+    }
+
+    return isCenter;
+}
+#endif
 
 void ApplistView::ArcScaleListStyleOnStart(void)
 {
@@ -295,13 +347,15 @@ void ApplistView::ArcScaleListStyleOnStart(void)
         ArcScaleList_->SetDraggable(true);
         ArcScaleList_->SetThrowDrag(true);
         ArcScaleList_->SetStyle(STYLE_BACKGROUND_OPA, OPA_TRANSPARENT);
-        ArcScaleList_->SetScrollBlankSize(10);//(50);
+        // 让首尾元素也能滑动到屏幕中线处:在顶部/底部各预留半屏的空白区
+        ArcScaleList_->SetScrollBlankSize(Screen::GetInstance().GetHeight() / 2, UIAbstractScroll::Direction::TOP);
+        ArcScaleList_->SetScrollBlankSize(Screen::GetInstance().GetHeight() / 2, UIAbstractScroll::Direction::BOTTOM);
         ArcScaleList_->SetMaxScrollDistance(MAX_SCROLL_DIS);
         ArcScaleList_->SetYScrollBarVisible(true);
         // ArcScaleList_->SetScrollStateListener(presenter_);
         ArcScaleList_->SetReboundSize(5);
         ArcScaleList_->EnableAutoAlign(true);
-        ArcScaleList_->SetItemSpace(0);
+        ArcScaleList_->SetItemSpace(20);
         ArcScaleList_->SetSelectPosition(ARC_SCALE_LIST_HEIGHT / 2);
         ArcScaleList_->SetRotateFactor(1.0);
         ArcScaleList_->RequestFocus();
@@ -341,8 +395,8 @@ void ApplistView::ArcScaleListStyleOnSetUpView(void)
             headY = presenter_->GetArcListHeadItemY();
         }
         if (headY == 0) { 
-            // headY = VERTICAL_RESOLUTION / NUM_2;
-            headY = -42;
+            headY = VERTICAL_RESOLUTION / NUM_2;
+            // headY = -42;
         }
     }
     WEARABLE_LOGD(WEARABLE_LOG_MODULE_APP, "[%d],startIndex = %d,headY = %d", __LINE__,startIndex,headY);