Widget cardText(String text) {
return FittedBox(
fit: BoxFit.contain,
child: Text(
textAlign: TextAlign.left,
text,
style: const TextStyle(
fontWeight: FontWeight.w600,
color: Colors.grey,
fontFamily: "Myriad"),
),
);
}
I want to align this textWidget left and it is coverd with a custom widget resizable widget which allow me to move it and resize it. And BoxFit.contain is the only fit that works for me.
I tried text align but it didn’t work Then i tried to put align widget with alignment Centerleft at different place and the one place that worked was above the FittedBox which came with a problem
When I put Alignment widget above the fitted box, the text doesn’t contain to the ResizableWidget’s size, It stays the same small even if i make the widget height or width large Here,
I want it to be contained in the resizable widget
Here’s the other Code
Whole Widget:
GestureDetector(
onTap: () {
Future.delayed(const Duration(milliseconds: 500));
setState(() {
setSelected(3);
});
},
child: ResizeableWidget(
selected: fatherNameSelected,
key: fatherNameKey,
child: cardText(fatherNameString)),
),
Resizable Widget:
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
class ResizeableWidget extends StatefulWidget {
ResizeableWidget({super.key, required this.child, required this.selected});
final Widget child;
bool selected;
@override
State<ResizeableWidget> createState() => ResizeableWidgetState();
}
const ballDiameter = 15.0;
class ResizeableWidgetState extends State<ResizeableWidget> {
double height = 200;
double width = 200;
double top = 0;
double left = 0;
void onDrag(double dx, double dy) {
var newHeight = height + dy;
var newWidth = width + dx;
setState(() {
height = newHeight > 0 ? newHeight : 0;
width = newWidth > 0 ? newWidth : 0;
});
}
// Method to get the current position
Offset getCurrentPosition() {
return Offset(left, top);
}
@override
Widget build(BuildContext context) {
return Stack(
children: <Widget>[
Positioned(
top: top,
left: left,
child: SizedBox(
height: height,
width: width,
child: widget.child,
),
),
// top left
Positioned(
top: top - ballDiameter / 2,
left: left - ballDiameter / 2,
child: ManipulatingBall(
selected: widget.selected,
onDrag: (dx, dy) {
var mid = (dx + dy) / 2;
var newHeight = height - 2 * mid;
var newWidth = width - 2 * mid;
setState(() {
height = newHeight > 0 ? newHeight : 0;
width = newWidth > 0 ? newWidth : 0;
top = top + mid;
left = left + mid;
});
},
),
),
// top middle
.........All 9 more Manupilating Balls Here............
],
);
}
}
class ManipulatingBall extends StatefulWidget {
ManipulatingBall({super.key, required this.onDrag, required this.selected});
final Function onDrag;
bool selected;
@override
State<ManipulatingBall> createState() => _ManipulatingBallState();
}
class _ManipulatingBallState extends State<ManipulatingBall> {
late double initX;
late double initY;
_handleDrag(details) {
setState(() {
initX = details.globalPosition.dx;
initY = details.globalPosition.dy;
});
}
_handleUpdate(details) {
var dx = details.globalPosition.dx - initX;
var dy = details.globalPosition.dy - initY;
initX = details.globalPosition.dx;
initY = details.globalPosition.dy;
widget.onDrag(dx, dy);
}
@override
Widget build(BuildContext context) {
if (widget.selected) {
return GestureDetector(
onPanStart: _handleDrag,
onPanUpdate: _handleUpdate,
child: Container(
width: ballDiameter,
height: ballDiameter,
decoration: BoxDecoration(
color: Colors.blue.withOpacity(0.95),
shape: BoxShape.circle,
),
),
);
} else {
return Container();
}
}
@override
void debugFillProperties(DiagnosticPropertiesBuilder properties) {
super.debugFillProperties(properties);
properties.add(DoubleProperty('initX', initX));
}
}