我不能理解如何操作线性梯度度。我有以下代码:
Container(
height: 100.0,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(6.0),
gradient: LinearGradient(begin: FractionalOffset.topLeft, end: FractionalOffset.bottomRight, colors: [
Color(0xFF148535),
Color(0xFF148535),
Color(0XFF0D6630),
Color(0XFF0D6630),
Color(0xFF148535),
Color(0xFF148535),
], stops: [
0.0,
0.3,
0.3,
0.7,
0.7,
1.0
]),
),
);
但是.topLeft
和.“bottomRight”不需要这样做。下面的图片显示了我想要得到的。(图片有偏移,不适合[0.0,0.3,0.3,0.7,0.7,1.0],因为这只是示例)
6条答案
按热度按时间o0lyfsai1#
这可能有助于确定Angular
例如:
有关梯度的更多详细信息:How to improve your Flutter application with gradient designs by Varun Chilukuri
sg2wtvxw2#
对于任何想知道答案的人来说,正确的方法是在线性梯度上使用
transform
,如下所示:我们在这里做的是绘制一个垂直渐变(在X轴上从
-1.0
到1.0
),并将其旋转45度(pi/4
)以创建对角渐变的效果。使用
Alignment
可能会在对象大小不同时产生不同的对角线(您可以通过在两个不同的框(一个纵向框和一个横向框)上应用相同的渐变来自己测试)。无论对象的尺寸如何,使用
transform
始终会产生相同的渐变。2ledvvac3#
请尝试使用以下值:
或事件更好
Y:参数说明
垂直方向上的距离分数。
值-1.0对应于最上边。值1.0
对应于最底部的边缘。值不限于该范围;
///小于-1.0的值表示位置在顶部以上,大于1.0的值///表示位置在底部以下。
ui7jx7zq4#
使用
Alignment.topLeft
和Alignment.bottomRight
83qze16e5#
作为triple7答案的一个选项,你可以使用弧度值代替pi表达式:
在这种情况下不需要
dart:math
。yzuktlbb6#
如果你想使用Angular 渐变,最好使用SweepGradient。你可以使用center,startAngle,和endAngle。下面是你正在寻找的解决方案:
以下是一个非常简单的示例,供希望了解和使用渐变和**Angular **的其他人使用: