【发布时间】:2021-08-05 12:50:42
【问题描述】:
这是我的 dart 文件,我想在其中创建一个可扩展的浮动按钮,该按钮包含在 Stack 小部件中,并且当我尝试在 GestureDetector 小部件或我的CircularButton 自定义小部件没有任何错误,并且在按下图标时它不会打开相应的应用程序。我尝试更改 customLaunch 的返回类型,但也没有用。
感谢任何帮助。 谢谢,
import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> with TickerProviderStateMixin {
void customLaunch(command) async {
if (await canLaunch(command)) {
await launch(command);
} else {
print(' could not launch $command');
}
}
AnimationController animationController;
Animation degOneTranslationAnimation,
degTwoTranslationAnimation,
degThreeTranslationAnimation;
Animation rotationAnimation;
double getRadiansFromDegree(double degree) {
double unitRadian = 57.295779513;
return degree / unitRadian;
}
@override
void initState() {
animationController =
AnimationController(vsync: this, duration: Duration(milliseconds: 600));
degOneTranslationAnimation = TweenSequence(<TweenSequenceItem>[
TweenSequenceItem<double>(
tween: Tween<double>(begin: 0.0, end: 1.2), weight: 75.0),
TweenSequenceItem<double>(
tween: Tween<double>(begin: 1.2, end: 1.0), weight: 25.0),
]).animate(animationController);
degTwoTranslationAnimation = TweenSequence(<TweenSequenceItem>[
TweenSequenceItem<double>(
tween: Tween<double>(begin: 0.0, end: 1.4), weight: 55.0),
TweenSequenceItem<double>(
tween: Tween<double>(begin: 1.4, end: 1.0), weight: 45.0)
]).animate(animationController);
degThreeTranslationAnimation = TweenSequence(<TweenSequenceItem>[
TweenSequenceItem<double>(
tween: Tween<double>(begin: 0.0, end: 1.75), weight: 35.0),
TweenSequenceItem<double>(
tween: Tween<double>(begin: 1.75, end: 1.0), weight: 65.0)
]).animate(animationController);
rotationAnimation = Tween<double>(begin: 180.0, end: 0.0).animate(
CurvedAnimation(parent: animationController, curve: Curves.easeOut));
super.initState();
animationController.addListener(() {
setState(() {});
});
}
@override
void dispose() {
animationController.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return DefaultTabController(
length: 5,
child: Scaffold(
floatingActionButtonLocation: FloatingActionButtonLocation.endFloat,
floatingActionButton: Stack(
children: [
Transform.translate(
offset: Offset.fromDirection(getRadiansFromDegree(270),
degOneTranslationAnimation.value * 100),
child: Transform(
transform: Matrix4.rotationZ(
getRadiansFromDegree(rotationAnimation.value))
..scale(degOneTranslationAnimation.value),
alignment: Alignment.center,
child: Container(
decoration: BoxDecoration(
color: Colors.black, shape: BoxShape.circle),
width: 50,
height: 50,
child: IconButton(
icon: Icon(Icons.repeat, color: Colors.white),
enableFeedback: true,
onPressed: () => customLaunch('https:google.com')),
),
),
),
Transform.translate(
offset: Offset.fromDirection(getRadiansFromDegree(225),
degOneTranslationAnimation.value * 100),
child: Transform(
transform: Matrix4.rotationZ(
getRadiansFromDegree(rotationAnimation.value))
..scale(degOneTranslationAnimation.value),
alignment: Alignment.center,
child: Container(
decoration: BoxDecoration(
color: Colors.black, shape: BoxShape.circle),
width: 50,
height: 50,
child: GestureDetector(
onTap: () => customLaunch('sms:546456464'),
child: IconButton(
icon: Icon(Icons.chat, color: Colors.white),
enableFeedback: true,
onPressed: () => {},
),
)),
),
),
Transform.translate(
offset: Offset.fromDirection(getRadiansFromDegree(180),
degOneTranslationAnimation.value * 100),
child: Transform(
transform: Matrix4.rotationZ(
getRadiansFromDegree(rotationAnimation.value))
..scale(degOneTranslationAnimation.value),
alignment: Alignment.center,
child: CircularButton(
onPressed: () => customLaunch('tel:+91 9478946545'),
color: Colors.black,
width: 50,
height: 50,
icon: Icon(
Icons.call,
color: Colors.white,
),
),
),
),
Transform(
transform: Matrix4.rotationZ(
getRadiansFromDegree(rotationAnimation.value)),
alignment: Alignment.center,
child: CircularButton(
color: Colors.black,
width: 60,
height: 60,
icon: Icon(
Icons.menu,
color: Colors.white,
),
onPressed: () {
if (animationController.isCompleted) {
animationController.reverse();
} else {
animationController.forward();
}
},
),
),
],
),
}
class CircularButton extends StatelessWidget {
final double width;
final double height;
final Color color;
final Icon icon;
final dynamic onPressed;
CircularButton({this.color, this.width, this.height, this.icon, this.onPressed});
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(color: color, shape: BoxShape.circle),
width: width,
height: height,
child: IconButton(icon: icon, enableFeedback: true, onPressed: onPressed),
);
}
}
我只想在扩展浮动按钮的点击上打开其他应用程序,但它没有打开,尽管代码中没有错误仍然无法正常工作。 它不仅需要 onpressed 参数或 onTap。
【问题讨论】:
-
您确定您的仅动画按钮不会遮挡其余用于手势检测的小部件吗?
-
@RandalSchwartz 所以如果它只有动画那么我怎么能让它也用动画检测手势
标签: flutter dart flutter-layout floating-action-button