Trying to build custom widget using https://pub.dev/packages/animated_toggle_switch with help from chatgpt. Specifically trying to replicate following example:
// Automatic FlutterFlow imports
import '/flutter_flow/flutter_flow_theme.dart';
import '/flutter_flow/flutter_flow_util.dart';
import '/custom_code/widgets/index.dart'; // Imports other custom widgets
import '/flutter_flow/custom_functions.dart'; // Imports custom functions
import 'package:flutter/material.dart';
// Begin custom widget code
// DO NOT REMOVE OR MODIFY THE CODE ABOVE!
import 'package:animated_toggle_switch/animated_toggle_switch.dart';
import 'package:url_launcher/url_launcher.dart';
class Animatedtoggleswitch extends StatefulWidget {
const Animatedtoggleswitch({
Key? key,
this.width,
this.height,
required this.initialIcon,
required this.finalIcon,
required this.initialText,
required this.finalText,
required this.initialTextColor,
required this.finalTextColor,
required this.initialBackgroundColor,
required this.finalBackgroundColor,
// required this.initialTextStyle,
// required this.finalTextStyle,
}) : super(key: key);
final double? width;
final double? height;
final icon initialIcon;
final icon finalIcon;
final String initialText;
final String finalText;
final Color initialTextColor;
final Color finalTextColor;
final Color initialBackgroundColor;
final Color finalBackgroundColor;
// final TextStyle initialTextStyle;
// final TextStyle finalTextStyle;
@override
_AnimatedtoggleswitchState createState() => _AnimatedtoggleswitchState();
}
class _AnimatedtoggleswitchState extends State<Animatedtoggleswitch> {
bool positive = false;
@override
Widget build(BuildContext context) {
return Column(
children: [
DefaultTextStyle.merge(
style: TextStyle(
color: positive ? widget.finalTextColor : widget.initialTextColor,
),
child: IconTheme.merge(
data: IconThemeData(color: Colors.white),
child: AnimatedToggleSwitch<bool>.dual(
current: positive,
first: false,
second: true,
spacing: 45.0,
animationDuration: const Duration(milliseconds: 600),
style: ToggleStyle(
borderColor: Colors.transparent,
indicatorColor: Colors.white,
backgroundColor: positive
? widget.finalBackgroundColor
: widget.initialBackgroundColor,
),
borderWidth: 6.0,
height: 60.0,
onChanged: (value) {
setState(() {
positive = value;
});
},
iconBuilder: (value) =>
value ? widget.finalIcon : widget.initialIcon, // Use IconData
textBuilder: (value) => value
? Center(child: Text(widget.finalText))
: Center(child: Text(widget.initialText)),
),
),
),
],
);
}
}
Getting following errors:
Undefined class 'icon'. Try changing the name to the name of an existing class, or creating a class with the name 'icon'.
Undefined class 'icon'. Try changing the name to the name of an existing class, or creating a class with the name 'icon'.