Преглед на файлове

feat(feedback): 新增意见反馈页面及图片自适应组件

- 创建 FeedbackCommonView 页面,包含反馈列表展示与空状态处理
- 添加点击反馈图标跳转至意见反馈页面的功能
- 在 HomeTopView 中新增反馈入口图标及点击事件
- 实现 AutoImage 组件,支持固定高度、宽度自适应的图片显示
- 更新路由配置,注册 Feedback 页面路径
- 完善基础库文档与导出模块,新增 AutoImage说明与引用
徐勤民 преди 1 месец
родител
ревизия
741555107f
променени са 4 файла, в които са добавени 58 реда и са изтрити 3 реда
  1. 7 0
      CHANGELOG.md
  2. 2 1
      Index.ets
  3. 13 2
      README.md
  4. 36 0
      src/main/ets/components/AutoImage.ets

+ 7 - 0
CHANGELOG.md

@@ -1,7 +1,14 @@
+# [v1.0.12] 2025.xx.xx
+
+> - 添加一个图片组件`AutoImage`,高度固定,宽度只适应
+>
+>
+
 # [v1.0.11] 2025.09.02
 
 > - 修改初始化逻辑,解决`This window state is abnormal`的问题
 >
+
 # [v1.0.10] 2025.05.30
 
 > - `ToolsHelper.showConfirmDialog()`&`ToolsHelper.showAlertDialog()`添加自定义`UI`功能

+ 2 - 1
Index.ets

@@ -58,7 +58,8 @@ export { LoadingView } from './src/main/ets/view/LoadingView'
 export { SafeView } from './src/main/ets/view/SafeView'
 export { RefreshView } from './src/main/ets/view/refresh/RefreshView'
 export { SwipeView } from './src/main/ets/view/SwipeView'
+export { AutoImage } from './src/main/ets/components/AutoImage'
 /**
- * 自定义view
+ * 全局
  */
 export { GlobalContext } from './src/main/ets/ContextConfig'

+ 13 - 2
README.md

@@ -409,7 +409,7 @@ struct MyView{
 
 > 使用时建议二次封装
 >
- 
+
 ```tsx
 // 参数定义如下
 /**
@@ -619,7 +619,7 @@ build() {
 }
 ```
 
-### 4.3.[SwipeView](src/main/ets/view/SwipeView.ets)
+### 4.4.[SwipeView](src/main/ets/view/SwipeView.ets)
 
 > 左滑删除
 >
@@ -639,6 +639,17 @@ build() {
     }
 ```
 
+### 4.5.[AutoImage](src/main/ets/components/AutoImage.ets)
+
+>
+> 高度固定,宽度自适应的图片组件
+>
+
+```tsx
+    AutoImage({ src: '', fixedHeight: 77 })
+        .margin({ right: 14 }) // 图片之间留点间距
+```
+
 ## 5.[Windows](./src/main/ets/utils/WindowHelper.ets)
 
 ### 5.1.弹出自定义窗口

+ 36 - 0
src/main/ets/components/AutoImage.ets

@@ -0,0 +1,36 @@
+// components/AutoImage.ets
+interface ImgSize {
+  width: number
+  height: number
+}
+
+@Component
+export struct AutoImage {
+  @Prop src: PixelMap | ResourceStr | DrawableDescriptor
+  @Prop fixedHeight: number = 120 // 固定高度(px)
+  @State imgWidth: number = 0 // 按比例算出的宽度
+  private naturalWidth: number = 0
+  private naturalHeight: number = 0
+
+  // 图片加载完成时,获取原图宽高并算宽度
+  onImageLoad(info: ImgSize) {
+    this.naturalWidth = info.width
+    this.naturalHeight = info.height
+    if (this.fixedHeight > 0 && this.naturalHeight > 0) {
+      // 按比例计算宽度
+      this.imgWidth = this.fixedHeight * (this.naturalWidth / this.naturalHeight)
+    }
+  }
+
+  build() {
+    Image(this.src)
+      .width(this.imgWidth > 0 ? this.imgWidth : 0)// 动态计算宽度
+      .height(this.fixedHeight)// 固定高度
+      .objectFit(ImageFit.Fill)// 保持比例用Fill/Cover/Contain自行选择
+      .onComplete((info) => {
+        if (info) {
+          this.onImageLoad({ width: info.width, height: info.height })
+        }
+      })
+  }
+}