Changed design servers list

This commit is contained in:
Juan Gilsanz Polo 2022-10-28 16:26:55 +02:00
parent 6ce8555226
commit 0853d5114b

View file

@ -13,7 +13,7 @@ import 'package:adguard_home_manager/models/server.dart';
import 'package:adguard_home_manager/providers/servers_provider.dart'; import 'package:adguard_home_manager/providers/servers_provider.dart';
import 'package:adguard_home_manager/services/http_requests.dart'; import 'package:adguard_home_manager/services/http_requests.dart';
class ServersList extends StatelessWidget { class ServersList extends StatefulWidget {
final BuildContext context; final BuildContext context;
final List<ExpandableController> controllers; final List<ExpandableController> controllers;
final Function(int) onChange; final Function(int) onChange;
@ -25,6 +25,52 @@ class ServersList extends StatelessWidget {
required this.onChange required this.onChange
}) : super(key: key); }) : super(key: key);
@override
State<ServersList> createState() => _ServersListState();
}
class _ServersListState extends State<ServersList> with SingleTickerProviderStateMixin {
late AnimationController animationController;
late Animation<double> animation;
@override
void initState() {
for (ExpandableController controller in widget.controllers) {
controller.addListener(() async {
await Future.delayed(const Duration(milliseconds: 200));
if (controller.value == false) {
animationController.animateTo(0);
}
else {
animationController.animateBack(1);
}
});
}
animationController = AnimationController(
duration: const Duration(milliseconds: 200),
vsync: this,
)
..addListener(() {
setState(() {});
});
animation = Tween(
begin: 0.0,
end: 0.5,
).animate(CurvedAnimation(
parent: animationController,
curve: Curves.easeInOut
));
super.initState();
}
@override
void dispose() {
animationController.dispose();
super.dispose();
}
@override @override
// ignore: avoid_renaming_method_parameters // ignore: avoid_renaming_method_parameters
Widget build(BuildContext context) { Widget build(BuildContext context) {
@ -33,8 +79,6 @@ class ServersList extends StatelessWidget {
List<Server> servers = serversProvider.serversList; List<Server> servers = serversProvider.serversList;
final width = MediaQuery.of(context).size.width;
void showDeleteModal(Server server) async { void showDeleteModal(Server server) async {
await Future.delayed(const Duration(seconds: 0), () => { await Future.delayed(const Duration(seconds: 0), () => {
showDialog( showDialog(
@ -170,26 +214,26 @@ class ServersList extends StatelessWidget {
margin: const EdgeInsets.only(right: 12), margin: const EdgeInsets.only(right: 12),
child: leadingIcon(servers[index]), child: leadingIcon(servers[index]),
), ),
SizedBox( Expanded(
width: width-168,
child: Column( child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [ children: [
Text( Text(
"${server.connectionMethod}://${server.domain}${server.path ?? ""}${server.port != null ? ':${server.port}' : ""}", "${server.connectionMethod}://${server.domain}${server.path ?? ""}${server.port != null ? ':${server.port}' : ""}",
textAlign: TextAlign.center, textAlign: TextAlign.center,
style: const TextStyle( style: const TextStyle(
fontSize: 17, fontSize: 18,
), ),
), ),
Column( Column(
children: [ children: [
const SizedBox(height: 10), const SizedBox(height: 5),
Text( Text(
servers[index].name, servers[index].name,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
style: const TextStyle( style: TextStyle(
fontSize: 14, fontSize: 14,
fontStyle: FontStyle.italic color: Theme.of(context).listTileTheme.iconColor
), ),
) )
], ],
@ -197,10 +241,12 @@ class ServersList extends StatelessWidget {
], ],
), ),
), ),
IconButton( Padding(
onPressed: () => onChange(index), padding: const EdgeInsets.only(right: 10),
icon: const Icon(Icons.arrow_drop_down), child: RotationTransition(
splashRadius: 20, turns: animation,
child: const Icon(Icons.keyboard_arrow_down_rounded),
),
), ),
], ],
); );
@ -318,14 +364,14 @@ class ServersList extends StatelessWidget {
) )
), ),
child: ExpandableNotifier( child: ExpandableNotifier(
controller: controllers[index], controller: widget.controllers[index],
child: Column( child: Column(
children: [ children: [
Expandable( Expandable(
collapsed: Material( collapsed: Material(
color: Colors.transparent, color: Colors.transparent,
child: InkWell( child: InkWell(
onTap: () => onChange(index), onTap: () => widget.onChange(index),
child: Padding( child: Padding(
padding: const EdgeInsets.all(10), padding: const EdgeInsets.all(10),
child: topRow(servers[index], index), child: topRow(servers[index], index),
@ -335,7 +381,7 @@ class ServersList extends StatelessWidget {
expanded: Material( expanded: Material(
color: Colors.transparent, color: Colors.transparent,
child: InkWell( child: InkWell(
onTap: () => onChange(index), onTap: () => widget.onChange(index),
child: Padding( child: Padding(
padding: const EdgeInsets.all(10), padding: const EdgeInsets.all(10),
child: Column( child: Column(