# 插值计算 >![](../../public_sys-resources/icon-note.gif) **说明:** >从API Version 7开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 ## 导入模块 ``` import curves from '@ohos.curves' ``` ## 权限 无 ## curves.init init\(curve?: Curve\): Object 插值曲线的初始化函数,可以根据入参创建一个插值曲线对象。 - 参数

参数名

类型

必填

默认值

说明

curve

Curve

Linear

曲线对象。

- 返回值 曲线对象Object。 ## curves.steps steps\(count: number, end: boolean\): Object 构造阶梯曲线对象。 - 参数:

参数名

类型

必填

默认值

说明

count

number

-

阶梯的数量,需要为正整数。

end

boolean

true

在每个间隔的起点或是终点发生阶跃变化 ,默认值为true,即在终点发生阶跃变化。

- 返回值 曲线对象Object。 ## curves.cubicBezier cubicBezier\(x1: number, y1: number, x2: number, y2: number\): Object 构造三阶贝塞尔曲线对象,曲线的值必须处于0-1之间。 - 参数

参数名

类型

必填

说明

x1

number

确定贝塞尔曲线第一点横坐标。

y1

number

确定贝塞尔曲线第一点纵坐标。

x2

number

确定贝塞尔曲线第二点横坐标。

y2

number

确定贝塞尔曲线第二点纵坐标。

- 返回值 曲线对象Object。 ## curves.spring spring\(velocity: number, mass: number, stiffness: number, damping: number\): Object 构造弹簧曲线对象。 - 参数

参数名

类型

必填

说明

velocity

number

初始速度。

mass

number

质量。

stiffness

number

刚度。

damping

number

阻尼。

- 返回值 曲线对象Object。 ## 示例 ``` import Curves from '@ohos.curves' let curve1 = Curves.init() // 创建一个默认线性插值曲线 let curve2 = Curves.init(Curve.EaseIn) // 创建一个默认先慢后快插值曲线 let curve3 = Curves.spring(100, 1, 228, 30) // 创建一个弹簧插值曲线 let curve3 = Curves.cubicBezier(0.1, 0.0, 0.1, 1.0) // 创建一个三阶贝塞尔曲线 ``` 曲线对象只能通过上面的接口创建。

接口名称

功能描述

interpolate(time: number): number

插值曲线的插值计算函数,可以通过传入的归一化时间参数返回当前的插值。

time: 当前的归一化时间参数,有效值范围0到1。

返回归一化time时间点对应的曲线插值。

- 示例 ``` import Curves from '@ohos.curves' let curve = Curves.init(Curve.EaseIn) // 创建一个默认先慢后快插值曲线 let value: number = curve.interpolate(0.5) // 计算得到时间到一半时的插值 ``` ## 整体示例 ``` import Curves from '@ohos.curves' @Entry @Component struct ImageComponent { @State widthSize: number = 200 @State heightSize: number = 200 build() { Column() { Text() .margin({top:100}) .width(this.widthSize) .height(this.heightSize) .backgroundColor(Color.Red) .onClick(()=> { let curve = Curves.cubicBezier(0.25, 0.1, 0.25, 1.0); this.widthSize = curve.interpolate(0.5) * this.widthSize; this.heightSize = curve.interpolate(0.5) * this.heightSize; }) .animation({duration: 2000 , curve: Curves.spring(0.25, 0.1, 0.25, 1.0)}) }.width("100%").height("100%") } } ``` ![](figures/5.gif)