external/revanced-manager
1
0
Fork 0
mirror of https://github.com/ReVanced/revanced-manager.git synced 2024-11-10 01:01:56 +01:00
Code Issues Projects Releases Packages Wiki Activity

feat(app-selector): improve skeleton UI (#939)

Browse source
This commit is contained in:
Aabed Khan 2023-06-15 15:42:39 +05:45 committed by GitHub
parent b161608d02
commit ec77987fcd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 51 additions and 45 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

96
lib/ui/widgets/appSelectorView/app_skeleton_loader.dart
View file

@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'package:revanced_manager/ui/widgets/shared/custom_card.dart';
import 'package:skeletons/skeletons.dart';
class AppSkeletonLoader extends StatelessWidget {
@ -7,59 +8,64 @@ class AppSkeletonLoader extends StatelessWidget {
@override
Widget build(BuildContext context) {
final screenWidth = MediaQuery.of(context).size.width;
return Skeleton(
isLoading: true,
skeleton: ListView.builder(
shrinkWrap: true,
itemCount: 7,
itemBuilder: (context, index) => Padding(
padding: const EdgeInsets.symmetric(vertical: 16, horizontal: 8.0),
child: SkeletonItem(
child: Row(
children: <Widget>[
SkeletonAvatar(
style: SkeletonAvatarStyle(
width: screenWidth * 0.15,
height: screenWidth * 0.15,
borderRadius: const BorderRadius.all(Radius.circular(12)),
return ListView.builder(
shrinkWrap: true,
itemCount: 7,
padding: EdgeInsets.zero,
itemBuilder: (context, index) => Padding(
padding: const EdgeInsets.symmetric(vertical: 8, horizontal: 12.0),
child: CustomCard(
child: Row(
children: [
SkeletonAvatar(
style: SkeletonAvatarStyle(
width: screenWidth * 0.10,
height: screenWidth * 0.10,
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(width: 16),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: <Widget>[
Container(
color: Colors.white,
height: 34,
width: screenWidth * 0.4,
child: SkeletonParagraph(
style: const SkeletonParagraphStyle(
lines: 1,
),
const SizedBox(height: 12),
SizedBox(
width: screenWidth * 0.6,
child: SkeletonLine(
style: SkeletonLineStyle(
height: 15,
width: screenWidth * 0.6,
borderRadius: const BorderRadius.all(Radius.circular(10)),
),
),
const SizedBox(height: 12),
Container(
margin: const EdgeInsets.only(bottom: 4),
color: Colors.white,
height: 34,
width: screenWidth * 0.6,
child: SkeletonParagraph(
style: const SkeletonParagraphStyle(
lines: 1,
),
),
const SizedBox(height: 5),
SizedBox(
width: screenWidth * 0.5,
child: SkeletonLine(
style: SkeletonLineStyle(
height: 15,
width: screenWidth * 0.5,
borderRadius: const BorderRadius.all(Radius.circular(10)),
),
),
],
),
],
),
),
],
),
],
),
),
),
child: const Center(
child: Text('Content'),
),
);
}
}