suragch
RTL Direction Support
Thank you for this great package.
I wonder if it is possible to add RTL support FEATURE to the progress bar direction.
Update
Can you make an image of what you would like it to look like? I'm not so familiar with how progress bars should look in RTL format.
The labels too, needs to change positions if RTL selected
Can you add those to your image?
The labels too, needs to change positions if RTL selected
Can you add those to your image?
@amafsoftoman
Thank you for the clarification. This is an interesting concept. I was previously aware of RTL text but I didn't realize that it affected things like audio controls. That makes sense, though.
Since this would require a significant change to the internal implementation of the code, I'd like to find out how big of a need this is. Are there some other popular apps that use RTL audio or video controls that I could check out?
@suragch
I totally agreed with you.
I've got the idea from the flutter itself; you can check the LinearProgressIndicator widget. you can see that it changes the direction according to the context.
Are there some other popular apps that use RTL audio or video controls that I could check out?
I don't think there is examples as far as i know. And I think its ok for a progress bar to be LTR on a RTL app, it just will make more sense if it switches the directions according to the app context.
For the record, I've tried to use Transform widget to flip the progress bar horizontally, it worked but not with labels. I'm sure this is a bad practice, however, it's a workaround that might be handy.
Transform(
alignment: Alignment.center,
transform: Matrix4.rotationY(math.pi),
child: ProgressBar(...),
)
I guess we wait to see if this interests others. Thank you.
Yes i'am
On Wed, Oct 26, 2022 at 1:55 PM suragch @.***> wrote:
Are you building an audio app yourself?
— Reply to this email directly, view it on GitHub https://github.com/suragch/audio_video_progress_bar/issues/52#issuecomment-1291787394, or unsubscribe https://github.com/notifications/unsubscribe-auth/A2ORYL2VIBCI73KDOPHO5X3WFD5Y5ANCNFSM6AAAAAARMTTRJE . You are receiving this because you were mentioned.Message ID: @.***>
@amafsoftoman
If the transform works without the labels, you could turn the labels off and make your own labels with text widgets. That could be a temporary fix while we wait to see how many people are interested in this feature.
Another option would be to copy the source code to your app and modify it to your desired behavior.
If either of these things work for you, it would be helpful if you linked to your code so that others can see how you do it.
The first option is the exact idea I had. I think I'll go with it at the moment.
I'll share any solution I came up with in the future.
Thank you very much
On Tue, Nov 1, 2022, 08:36 suragch @.***> wrote:
@amafsoftoman https://github.com/amafsoftoman
If the transform works without the labels, you could turn the labels off and make your own labels with text widgets. That could be a temporary fix while we wait to see how many people are interested in this feature.
Another option would be to copy the source code to your app and modify it to your desired behavior.
If either of these things work for you, it would be helpful if you linked to your code so that others can see how you do it.
— Reply to this email directly, view it on GitHub https://github.com/suragch/audio_video_progress_bar/issues/52#issuecomment-1298016946, or unsubscribe https://github.com/notifications/unsubscribe-auth/A2ORYL5NLT6UYE6RV5WYJ53WGCM4LANCNFSM6AAAAAARMTTRJE . You are receiving this because you were mentioned.Message ID: @.***>
Interested in RTL support.
@MohamadGreatWarrior
It would be awesome if this package supported right-to-left (RTL) direction. However, for the time being, I've managed to achieve the desired results by utilizing the Flutter Transform.flip widget. I disabled the default labels and created custom ones connected to the progress listener.
This solution works perfectly, but it's just a workaround. It essentially involves integrating built-in components with a custom coding approach
@suragch , I Think it's really needed now 😃 As I can see , more people seem interested in RTL support.
For anyone interested in the workaround, while waiting for update, here is it:
ValueListenableBuilder<ProgressBarState>(
valueListenable: audio.progressNotifier,
builder: (_, value, __) {
return Padding(
padding: EdgeInsets.symmetric(horizontal: LARGE_PADDING_VALUE),
child: Column(
children: [
Transform.flip(
flipX: true,
child: ProgressBar(
thumbRadius: 6,
barHeight: 4,
timeLabelPadding: 10,
progress: value.current,
buffered: value.buffered,
total: value.total,
onSeek: audio.goto,
timeLabelLocation: TimeLabelLocation.none,
),
),
addVerticalSpace(3),
//Custom labels
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Text(
formatTime(value.current.inSeconds),
style: AppTextTheme(context).text12,
),
Text(
formatTime(value.total.inSeconds),
style: AppTextTheme(context).text12,
),
],
)
],
),
);
});
Just disable default labels and create custom one, and then add the value from the listener with some time formatting.
If anyone interested in converting seconds to a formatted time, here is a simple method:
String formatTime(int seconds) {
int sec = (seconds % 60);
int min = (seconds / 60).floor();
String minutes = min.toString().length <= 1 ? '0$min' : '$min';
String second = sec.toString().length <= 1 ? '0$sec' : '$sec';
return '$minutes:$second';
}
Thank you for sharing your workaround, @amafsoftoman . I hope that will make it easier for others to support RTL in their apps.
I've been pretty busy with my client work recently, so I haven't had a lot of time to contribute to free open-source projects. I realize this probably isn't possible for indie developers, but if there are any companies out there who would be willing to fund a feature request like this, I'm open to that. But if not, I'd still consider implementing it, but probably not right way. Until then, I recommend people use the solution above.