RelativeContainer如何让多个view居中

@Entry 
@Component 
struct Index1 { 
  
  @State textWidth:number=0 
  @State textHeight:number=0 
  build() { 
    Row() { 
      RelativeContainer() { 
        Image($r('app.media.startIcon')) 
          .width(50).height(50) 
          .alignRules({ 
            top: {anchor: "__container__", align: VerticalAlign.Center}, 
            left: {anchor: "__container__", align: HorizontalAlign.Center} 
          }) 
          .id("row1") 
          .offset({x:-25,y:-(25+this.textHeight/2)}) 
        Row() { 
          Text('我是第一个组件') 
        }.onAreaChange((oldArea: Area, newArea: Area)=>{ 
          console.info('cbl'+newArea.height) 
          if (typeof newArea.width == 'number' && typeof newArea.height == 'number') { 
            this.textWidth =newArea.width 
            this.textHeight=newArea.height 
          } 
        }) 
        .alignRules({ 
          top: {anchor: "row1", align: VerticalAlign.Bottom}, 
          left: {anchor: "row1", align: HorizontalAlign.Start} 
        }) 
        .id("row2") 
        .offset({x:-this.textWidth/2,y:-(25+this.textHeight/2)}) 
      } 
      .border({width:2, color: "#6699FF"}) 
  
    } 
    .height('100%') 
    .width('100%') 
  } 
}