我已经使用矩阵手势检测器包来拖动文本和图像,但似乎只有图像可以成功拖动,而文本拖动在一个小区域,使其消失。
class CustomOverlay extends StatelessWidget {
final Widget child;
const CustomOverlay({required this.child,Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
final ValueNotifier<Matrix4> notifier = ValueNotifier(Matrix4.identity());
return MatrixGestureDetector(
onMatrixUpdate: (matrix, translationDeltaMatrix, scaleDeltaMatrix, rotationDeltaMatrix) {
notifier.value=matrix;
},
child: AnimatedBuilder(
animation: notifier,
builder: (context, childWidget) {
return Transform(
transform: notifier.value,
child: FittedBox(
fit: BoxFit.contain,
alignment: Alignment.center,
child: child,
)
);
},
),
);
}
}
这是使用矩阵手势检测器的自定义小部件
Text(
'Sample',
style: TextStyle(
color: Colors.white,
),
),
这是一个文本小部件,将在堆栈中使用
SizedBox(
height: size.height*0.5,
width: size.width,
child: Stack(
children: [
ColorFiltered(
colorFilter: ColorFilter.mode(hoodieColor, BlendMode.modulate),
child: Image.asset(apparelDesign[1]['image'],fit: BoxFit.cover,height: size.height*0.5,width: size.width,)
),
Positioned(
bottom: size.height*0.2,
left: size.width*0.35,
child: Container(
height: size.height*0.225,
width: size.width*0.3,
decoration: BoxDecoration(
color: Colors.transparent,
border: Border.all(
color: Colors.black,
width: 1,
)
),
child: Stack(
children: [
for(int i=0;i<customWidgets.length;i++)
customWidgets[i],
],
),
),
)
]
),
)
customWidget是小部件的列表,其中包括文本和图像,可以在容器周围拖动,该容器受到限制,因此小部件只能在容器内部拖动和放置
我希望文本能够在容器内自由移动(拖动),它应该适合容器内
1条答案
按热度按时间7vux5j2d1#
我已经解决了这个问题。我已经使用约束盒代替了安装盒