mirror of
https://github.com/stonega/tsacdop
synced 2025-02-17 20:10:37 +01:00
Change episode detail page download button ui.
This commit is contained in:
parent
57e7bfbf3f
commit
7c828f1ee6
@ -8,6 +8,7 @@ import 'package:flutter_downloader/flutter_downloader.dart';
|
||||
import 'package:permission_handler/permission_handler.dart';
|
||||
import 'package:fluttertoast/fluttertoast.dart';
|
||||
import 'package:connectivity/connectivity.dart';
|
||||
import 'package:tsacdop/util/custom_widget.dart';
|
||||
|
||||
import '../state/download_state.dart';
|
||||
import '../state/audio_state.dart';
|
||||
@ -166,10 +167,18 @@ class _DownloadButtonState extends State<DownloadButton> {
|
||||
return Selector<SettingState, bool>(
|
||||
selector: (_, settings) => settings.downloadUsingData,
|
||||
builder: (_, data, __) => _buttonOnMenu(
|
||||
Icon(
|
||||
LineIcons.download_solid,
|
||||
//size: 15,
|
||||
color: Colors.grey[700],
|
||||
Center(
|
||||
child: SizedBox(
|
||||
height: 18,
|
||||
width: 18,
|
||||
child: CustomPaint(
|
||||
painter: DownloadPainter(
|
||||
color: Colors.grey[700],
|
||||
fraction: 0,
|
||||
progressColor: context.accentColor,
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
() => _requestDownload(task.episode, data)),
|
||||
);
|
||||
@ -185,15 +194,19 @@ class _DownloadButtonState extends State<DownloadButton> {
|
||||
height: 50.0,
|
||||
alignment: Alignment.center,
|
||||
padding: EdgeInsets.symmetric(horizontal: 18.0),
|
||||
child: SizedBox(
|
||||
height: 18,
|
||||
width: 18,
|
||||
child: CircularProgressIndicator(
|
||||
backgroundColor: Colors.grey[500],
|
||||
strokeWidth: 2,
|
||||
valueColor: AlwaysStoppedAnimation<Color>(
|
||||
Theme.of(context).accentColor),
|
||||
value: task.progress / 100,
|
||||
child: TweenAnimationBuilder(
|
||||
duration: Duration(milliseconds: 1000),
|
||||
tween: Tween(begin: 0.0, end: 1.0),
|
||||
builder: (context, fraction, child) => SizedBox(
|
||||
height: 18,
|
||||
width: 18,
|
||||
child: CustomPaint(
|
||||
painter: DownloadPainter(
|
||||
color: Colors.grey[700],
|
||||
fraction: fraction,
|
||||
progressColor: context.accentColor,
|
||||
progress: task.progress / 100),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
@ -211,14 +224,20 @@ class _DownloadButtonState extends State<DownloadButton> {
|
||||
height: 50.0,
|
||||
alignment: Alignment.center,
|
||||
padding: EdgeInsets.symmetric(horizontal: 18),
|
||||
child: SizedBox(
|
||||
height: 18,
|
||||
width: 18,
|
||||
child: CircularProgressIndicator(
|
||||
backgroundColor: Colors.grey[500],
|
||||
strokeWidth: 2,
|
||||
valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
|
||||
value: task.progress / 100,
|
||||
child: TweenAnimationBuilder(
|
||||
duration: Duration(milliseconds: 500),
|
||||
tween: Tween(begin: 0.0, end: 1.0),
|
||||
builder: (context, fraction, child) => SizedBox(
|
||||
height: 18,
|
||||
width: 18,
|
||||
child: CustomPaint(
|
||||
painter: DownloadPainter(
|
||||
color: Colors.grey[700],
|
||||
fraction: 1,
|
||||
progressColor: context.accentColor,
|
||||
progress: task.progress / 100,
|
||||
pauseProgress: fraction),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
|
@ -815,48 +815,43 @@ class _SearchResultDetailState extends State<SearchResultDetail>
|
||||
overflow: TextOverflow.fade,
|
||||
style: TextStyle(color: context.accentColor),
|
||||
),
|
||||
Padding(
|
||||
padding: const EdgeInsets.only(top: 8),
|
||||
child: !_isSubscribed
|
||||
? OutlineButton(
|
||||
highlightedBorderColor:
|
||||
context.accentColor,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius:
|
||||
BorderRadius.circular(100.0),
|
||||
side: BorderSide(
|
||||
color: context.accentColor)),
|
||||
splashColor: context.accentColor
|
||||
.withOpacity(0.5),
|
||||
child: Text(s.subscribe,
|
||||
style: TextStyle(
|
||||
color: context.accentColor)),
|
||||
onPressed: () {
|
||||
subscribePodcast(
|
||||
widget.onlinePodcast);
|
||||
setState(() {
|
||||
_isSubscribed = true;
|
||||
});
|
||||
Fluttertoast.showToast(
|
||||
msg: s.podcastSubscribed,
|
||||
gravity: ToastGravity.BOTTOM,
|
||||
);
|
||||
})
|
||||
: OutlineButton(
|
||||
color: context.accentColor
|
||||
.withOpacity(0.5),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius:
|
||||
BorderRadius.circular(100.0),
|
||||
side: BorderSide(
|
||||
color: Colors.grey[500])),
|
||||
highlightedBorderColor:
|
||||
Colors.grey[500],
|
||||
disabledTextColor: Colors.grey[500],
|
||||
child: Text(s.subscribe),
|
||||
disabledBorderColor: Colors.grey[500],
|
||||
onPressed: () {}),
|
||||
)
|
||||
!_isSubscribed
|
||||
? OutlineButton(
|
||||
highlightedBorderColor:
|
||||
context.accentColor,
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius:
|
||||
BorderRadius.circular(100.0),
|
||||
side: BorderSide(
|
||||
color: context.accentColor)),
|
||||
splashColor:
|
||||
context.accentColor.withOpacity(0.5),
|
||||
child: Text(s.subscribe,
|
||||
style: TextStyle(
|
||||
color: context.accentColor)),
|
||||
onPressed: () {
|
||||
subscribePodcast(widget.onlinePodcast);
|
||||
setState(() {
|
||||
_isSubscribed = true;
|
||||
});
|
||||
Fluttertoast.showToast(
|
||||
msg: s.podcastSubscribed,
|
||||
gravity: ToastGravity.BOTTOM,
|
||||
);
|
||||
})
|
||||
: OutlineButton(
|
||||
color:
|
||||
context.accentColor.withOpacity(0.5),
|
||||
shape: RoundedRectangleBorder(
|
||||
borderRadius:
|
||||
BorderRadius.circular(100.0),
|
||||
side: BorderSide(
|
||||
color: Colors.grey[500])),
|
||||
highlightedBorderColor: Colors.grey[500],
|
||||
disabledTextColor: Colors.grey[500],
|
||||
child: Text(s.subscribe),
|
||||
disabledBorderColor: Colors.grey[500],
|
||||
onPressed: () {})
|
||||
],
|
||||
),
|
||||
),
|
||||
|
@ -348,7 +348,8 @@ class AudioPlayerNotifier extends ChangeNotifier {
|
||||
.where((event) => event != null)
|
||||
.listen((event) async {
|
||||
_current = DateTime.now();
|
||||
_audioState = event?.processingState;
|
||||
if (event.processingState != AudioProcessingState.none)
|
||||
_audioState = event.processingState;
|
||||
_playing = event?.playing;
|
||||
_currentSpeed = event.speed;
|
||||
_currentPosition = event.currentPosition.inMilliseconds ?? 0;
|
||||
|
@ -41,8 +41,8 @@ class _AudioPanelState extends State<AudioPanel> with TickerProviderStateMixin {
|
||||
..addListener(() {
|
||||
if (mounted) setState(() {});
|
||||
});
|
||||
_animation =
|
||||
Tween<double>(begin: initSize, end: initSize).animate(_controller);
|
||||
_animation = Tween<double>(begin: 0, end: initSize).animate(_controller);
|
||||
_controller.forward();
|
||||
super.initState();
|
||||
}
|
||||
|
||||
|
@ -832,7 +832,7 @@ class _HeartOpenState extends State<HeartOpen>
|
||||
}
|
||||
}
|
||||
|
||||
/// Icon painter.
|
||||
/// Icon using a painter.
|
||||
class IconPainter extends StatelessWidget {
|
||||
const IconPainter(this.painter, {this.height = 10, this.width = 30, Key key})
|
||||
: super(key: key);
|
||||
@ -851,7 +851,7 @@ class IconPainter extends StatelessWidget {
|
||||
}
|
||||
}
|
||||
|
||||
/// A dot.
|
||||
/// A dot just a dot.
|
||||
class DotIndicator extends StatelessWidget {
|
||||
DotIndicator({this.radius = 8, Key key})
|
||||
: assert(radius > 0),
|
||||
@ -867,3 +867,83 @@ class DotIndicator extends StatelessWidget {
|
||||
BoxDecoration(shape: BoxShape.circle, color: context.accentColor));
|
||||
}
|
||||
}
|
||||
|
||||
class DownloadPainter extends CustomPainter {
|
||||
double fraction;
|
||||
Color color;
|
||||
Color progressColor;
|
||||
double progress;
|
||||
double pauseProgress;
|
||||
DownloadPainter(
|
||||
{this.fraction,
|
||||
this.color,
|
||||
this.progressColor,
|
||||
this.progress = 0,
|
||||
this.pauseProgress = 0});
|
||||
|
||||
@override
|
||||
void paint(Canvas canvas, Size size) {
|
||||
var _paint = Paint()
|
||||
..color = color
|
||||
..strokeWidth = 2.0
|
||||
..strokeCap = StrokeCap.round;
|
||||
var _linePaint = Paint()
|
||||
..color = color.withAlpha(70)
|
||||
..strokeWidth = 2.0
|
||||
..strokeCap = StrokeCap.round;
|
||||
var _circlePaint = Paint()
|
||||
..color = color.withAlpha(70)
|
||||
..style = PaintingStyle.stroke
|
||||
..strokeWidth = 2;
|
||||
var _progressPaint = Paint()
|
||||
..color = progressColor
|
||||
..style = PaintingStyle.stroke
|
||||
..strokeWidth = 2;
|
||||
double width = size.width;
|
||||
double height = size.height;
|
||||
var center = Offset(size.width / 2, size.height / 2);
|
||||
if (pauseProgress == 0) {
|
||||
canvas.drawLine(
|
||||
Offset(width / 2, 0), Offset(width / 2, height * 4 / 5), _paint);
|
||||
canvas.drawLine(Offset(width / 5, height / 2),
|
||||
Offset(width / 2, height * 4 / 5), _paint);
|
||||
canvas.drawLine(Offset(width * 4 / 5, height / 2),
|
||||
Offset(width / 2, height * 4 / 5), _paint);
|
||||
}
|
||||
|
||||
if (fraction == 0)
|
||||
canvas.drawLine(
|
||||
Offset(width / 5, height), Offset(width * 4 / 5, height), _paint);
|
||||
else {
|
||||
canvas.drawArc(Rect.fromCircle(center: center, radius: width / 2),
|
||||
math.pi / 2, math.pi * fraction, false, _circlePaint);
|
||||
canvas.drawArc(Rect.fromCircle(center: center, radius: width / 2),
|
||||
math.pi / 2, -math.pi * fraction, false, _circlePaint);
|
||||
}
|
||||
|
||||
if (fraction == 1) {
|
||||
canvas.drawArc(Rect.fromCircle(center: center, radius: width / 2),
|
||||
-math.pi / 2, math.pi * 2 * progress, false, _progressPaint);
|
||||
}
|
||||
|
||||
if (pauseProgress > 0) {
|
||||
canvas.drawLine(
|
||||
Offset(width / 5 + height * 3 * pauseProgress / 20,
|
||||
height / 2 - height * 3 * pauseProgress / 10),
|
||||
Offset(width / 2 - height * 3 * pauseProgress / 20, height * 4 / 5),
|
||||
_paint);
|
||||
canvas.drawLine(
|
||||
Offset(width * 4 / 5 - height * 3 * pauseProgress / 20,
|
||||
height / 2 - height * 3 * pauseProgress / 10),
|
||||
Offset(width / 2 + height * 3 * pauseProgress / 20, height * 4 / 5),
|
||||
_paint);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
bool shouldRepaint(DownloadPainter oldDelegate) {
|
||||
return oldDelegate.fraction != fraction ||
|
||||
oldDelegate.progress != progress ||
|
||||
oldDelegate.pauseProgress != pauseProgress;
|
||||
}
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user