怎么让text文本排在image里面的右下角

//1、怎么让text文本排在image里面的右下角 
//2、怎么给浮层中的文字设置大小和背景颜色。 
@Entry 
@Component 
struct Index { 
  //使用自定义组件构造函数实现text文本排在image的右下角，给浮层中的文字设置大小和背景颜色。 
  @Builder 
  OverlayNode() { 
    Column({ space: 5 }) { 
      Image($r('app.media.img')) 
 
      Text("这是一辆超跑")//给浮层中的文字设置大小和背景颜色。 
        .fontSize(24) 
        .fontColor(Color.Yellow) 
        .fontWeight(FontWeight.Bold) 
        .backgroundColor(Color.Black) 
        .offset({ 
          //文本位置偏移，让text文本排在image的右下角 
          x: 80 
        }) 
    } 
    .width(300) 
    .height(200) 
  } 
 
  build() { 
    Column({ space: 20 }) { 
      Text('浮层') 
        .fontSize(24) 
        .fontWeight(FontWeight.Bold) 
 
      Text('这是一辆飞驰在道路上的跑车') 
      Image($r('app.media.img_1')) 
        .overlay(this.OverlayNode(), { 
          //使用浮层，调用自定义组件构造函数 
          align: Alignment.Center 
        }) 
        .objectFit(ImageFit.Contain) 
    } 
    .width('100%') 
    .height('100%') 
    .border({ color: Color.Red, width: 2 }) 
    .padding(20) 
  } 
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.