音乐播放悬浮按钮该如何布局？

@Entry 
@Component 
struct ButtonPage { 
  build() { 
    RelativeContainer() { 
      List() { 
        ListItem() { 
          Image('./common/image/3.PNG') 
            .height(500).width('100%') 
        } 
        ListItem() { 
          Image('./common/image/4.PNG') 
            .height(500).width('100%') 
        } 
        ListItem() { 
          Image('./common/image/5.PNG') 
            .height(500).width('100%') 
        } 
      } 
      .alignListItem(ListItemAlign.Center) 
      .alignRules({ 
        top: { anchor: '__container__', align: VerticalAlign.Top }, //以父容器为锚点，竖直方向顶头对齐 
        middle: { anchor: '__container__', align: HorizontalAlign.Center } //以父容器为锚点，水平方向居中对齐 
      }) 
      .id('row1') //设置锚点为row1 
      Row() { 
        Button('播放按钮').width('100%').height(45) 
      } 
      .borderColor(Color.Black) 
      .width('100%') 
      .margin({bottom:20}) 
      .padding(20) 
      .borderRadius(16) 
      .alignRules({ 
        bottom: {anchor: "__container__", align: VerticalAlign.Bottom}, 
        middle: {anchor: "__container__", align: HorizontalAlign.Center} 
      }) 
      // .border({ width: 2, color: '#6699FF' }) 
      .id('row2') //设置锚点为row2 
    } 
    .width('100%') 
    .height('100%') 
  
  } 
}