Reputation: 79
i have one blue container when double tap on this red container open. and the red container position is fix it is not change when blue container move that time if red container and blue container border same than not move to more this direction than another direction to move in flutter.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
double blueContainerX = 50;
double blueContainerY = 50;
bool showRedContainer = false;
double redContainerX = 50;
double redContainerY = 50;
double blueContainerWidth = 200;
double blueContainerHeight = 200;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Container Demo'),
),
body: Center(
child: Stack(
children: [
// Red Container (Fixed or Positioned based on showRedContainer)
if (showRedContainer)
Positioned(
left: redContainerX,
top: redContainerY,
child: Container(
width: 50,
height: 50,
decoration: BoxDecoration(
border: Border.all(
color: Colors.red,
width: 2.0, // Border width
),
),
),
),
// Blue Container (Draggable)
Positioned(
left: blueContainerX,
top: blueContainerY,
child: GestureDetector(
onDoubleTap: () {
setState(() {
if (!showRedContainer) {
// Set red container's position only when it's double-tapped
showRedContainer = true;
redContainerX = blueContainerX;
redContainerY = blueContainerY;
}
});
},
onPanUpdate: (details) {
setState(() {
// Update blue container position
blueContainerX += details.delta.dx;
blueContainerY += details.delta.dy;
// Limit blue container movement within screen bounds
blueContainerX = blueContainerX.clamp(0.0, MediaQuery.of(context).size.width - blueContainerWidth);
blueContainerY = blueContainerY.clamp(0.0, MediaQuery.of(context).size.height - blueContainerHeight);
// Stop blue container movement when red container borders align
if ((blueContainerX + blueContainerWidth == redContainerX + 50 && details.delta.dx > 0) ||
(blueContainerY + blueContainerHeight == redContainerY + 50 && details.delta.dy > 0)) {
blueContainerX = blueContainerX;
blueContainerY = blueContainerY;
}
});
},
child: Container(
width: blueContainerWidth,
height: blueContainerHeight,
decoration: BoxDecoration(
border: Border.all(
color: Colors.blue,
width: 2.0, // Border width
),
),
),
),
),
],
),
),
);
}
}
i have one blue container when double tap on this red container open. and the red container position is fix it is not change when blue container move that time if red container and blue container border same than not move to more this direction than another direction to move in flutter.
i have one blue container when double tap on this red container open. and the red container position is fix it is not change when blue container move that time if red container and blue container border same than not move to more this direction than another direction to move in flutter.
Upvotes: 0
Views: 41