平移
作用:可使组件在以组件左上角为坐标原点的坐标系中进行移动
属性:translate()
参数:{x?: X轴移动距离, y?: Y轴移动距离, z?: Z轴移动距离}
bash
@Entry
@Component
struct Index {
@State message: string = '点我';
build() {
Text()
.width(100)
.height(100)
.backgroundColor('#f00')
.translate({
x:'100%',//向右移动自身的100% ,在这里相当于移动100
y:'100%'
})
}
}
缩放
作用:分别设置X轴、Y轴、Z轴的缩放比例,默认值为1
属性:scale(),
参数: {x?: X轴缩放比例, y?: Y轴缩放比例, z?: Z轴缩放比例, centerX?: Y轴中心点坐标, centerY? Y轴中心点坐标}
bash
@Entry
@Component
struct Index {
@State message: string = '点我';
build() {
Text()
.width(100)
.height(100)
.backgroundColor('#f00')
.translate({
x:'100%',
y:'100%'
})
.scale({
x:1.5, //相当于宽放大了1.5倍
y:2 //比例
})
}
}
旋转
作用:可使组件在以组件左上角为坐标原点的坐标系中进行旋转
属性:rotate()
参数:{angle: 旋转角度, centerX?: Y轴中心点坐标, centerY? Y轴中心点坐标}
bash
@Entry
@Component
struct Index {
@State message: string = '点我';
build() {
Text()
.width(100)
.height(100)
.backgroundColor('#f00')
.translate({
x:'100%',
y:'100%'
})
.scale({
x:1.5, //相当于宽放大了1.5倍
y:2 //比例
})
.rotate({
angle:50, //角度
centerX:100,
centerY:100
})
}
}