mirror of
https://github.com/revanced/revanced-manager
synced 2024-05-14 13:56:57 +02:00
feat(app-selector): improve skeleton UI (#939)
This commit is contained in:
parent
b161608d02
commit
ec77987fcd
@ -1,4 +1,5 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'package:revanced_manager/ui/widgets/shared/custom_card.dart';
|
||||||
import 'package:skeletons/skeletons.dart';
|
import 'package:skeletons/skeletons.dart';
|
||||||
|
|
||||||
class AppSkeletonLoader extends StatelessWidget {
|
class AppSkeletonLoader extends StatelessWidget {
|
||||||
@ -7,59 +8,64 @@ class AppSkeletonLoader extends StatelessWidget {
|
|||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
final screenWidth = MediaQuery.of(context).size.width;
|
final screenWidth = MediaQuery.of(context).size.width;
|
||||||
return Skeleton(
|
return ListView.builder(
|
||||||
isLoading: true,
|
shrinkWrap: true,
|
||||||
skeleton: ListView.builder(
|
itemCount: 7,
|
||||||
shrinkWrap: true,
|
padding: EdgeInsets.zero,
|
||||||
itemCount: 7,
|
itemBuilder: (context, index) => Padding(
|
||||||
itemBuilder: (context, index) => Padding(
|
padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 12.0),
|
||||||
padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 8.0),
|
child: CustomCard(
|
||||||
child: SkeletonItem(
|
child: Row(
|
||||||
child: Row(
|
children: [
|
||||||
children: <Widget>[
|
SkeletonAvatar(
|
||||||
SkeletonAvatar(
|
style: SkeletonAvatarStyle(
|
||||||
style: SkeletonAvatarStyle(
|
width: screenWidth * 0.10,
|
||||||
width: screenWidth * 0.15,
|
height: screenWidth * 0.10,
|
||||||
height: screenWidth * 0.15,
|
borderRadius: const BorderRadius.all(Radius.circular(12)),
|
||||||
borderRadius: const BorderRadius.all(Radius.circular(12)),
|
),
|
||||||
|
),
|
||||||
|
const SizedBox(width: 16),
|
||||||
|
Column(
|
||||||
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
|
children: <Widget>[
|
||||||
|
SizedBox(
|
||||||
|
width: screenWidth * 0.4,
|
||||||
|
child: SkeletonLine(
|
||||||
|
style: SkeletonLineStyle(
|
||||||
|
height: 20,
|
||||||
|
width: screenWidth * 0.4,
|
||||||
|
borderRadius: const BorderRadius.all(Radius.circular(10)),
|
||||||
|
),
|
||||||
|
),
|
||||||
),
|
),
|
||||||
),
|
const SizedBox(height: 12),
|
||||||
const SizedBox(width: 16),
|
SizedBox(
|
||||||
Column(
|
width: screenWidth * 0.6,
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
child: SkeletonLine(
|
||||||
children: <Widget>[
|
style: SkeletonLineStyle(
|
||||||
Container(
|
height: 15,
|
||||||
color: Colors.white,
|
width: screenWidth * 0.6,
|
||||||
height: 34,
|
borderRadius: const BorderRadius.all(Radius.circular(10)),
|
||||||
width: screenWidth * 0.4,
|
|
||||||
child: SkeletonParagraph(
|
|
||||||
style: const SkeletonParagraphStyle(
|
|
||||||
lines: 1,
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
const SizedBox(height: 12),
|
),
|
||||||
Container(
|
const SizedBox(height: 5),
|
||||||
margin: const EdgeInsets.only(bottom: 4),
|
SizedBox(
|
||||||
color: Colors.white,
|
width: screenWidth * 0.5,
|
||||||
height: 34,
|
child: SkeletonLine(
|
||||||
width: screenWidth * 0.6,
|
style: SkeletonLineStyle(
|
||||||
child: SkeletonParagraph(
|
height: 15,
|
||||||
style: const SkeletonParagraphStyle(
|
width: screenWidth * 0.5,
|
||||||
lines: 1,
|
borderRadius: const BorderRadius.all(Radius.circular(10)),
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
),
|
||||||
),
|
],
|
||||||
],
|
),
|
||||||
),
|
],
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
child: const Center(
|
|
||||||
child: Text('Content'),
|
|
||||||
),
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user