个人名片页

做一张个人名片页：一张圆头像、姓名、一行职位、一段签名、三行联系方式、底部一行左右分开的小字。全部用 Column、Row、Text、Image 四个东西摆出来。

它同时是一台布局透视镜——页面顶上两个可以点的小胶囊，一个开关容器边框，一个切换交叉轴对齐方式，让你直接看见每一层容器实际占了多大地方。

本篇立一条自己能兑现的规矩：名片上出现的每一处文字、每一张图、每一个颜色、每一个字号，一律走资源目录，不写死在 build() 里。

起手的骨架（code/01-Index.ets，还不设任何样式）：

// entry/src/main/ets/pages/Index.ets
@Entry
@Component
struct Index {
  build() {
    Column() {
      // ① 封面区
      Column() {
        Text('（头像占位）')
        Text('李思远')
        Text('HarmonyOS 应用开发')
      }

      // ② 签名区
      Text('从 Android 转过来的第 12 天。这里放一段两三行的签名，用来观察文字变长以后会发生什么。')
    }
  }
}

M0 占位版本：完整的分步走查（<Hero> / <Steps> / <Step> 等组件）在 M1 落地，届时用 docs/conversion-draft/S1-01/ 的转换稿替换本文正文。