fix: Adapted widgets for desktop #2765
Merged
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Reviewer's GuideIntroduces dynamic sizing and refactors widget layouts to adapt to varying window dimensions, using LayoutBuilder-driven clamping for the gauge and a scrollable, constrained layout for instrument stats. Updated class diagram for GaugeWidget and InstrumentstatsclassDiagram
class GaugeWidget {
+double gaugeSize
+double currentValue
+double minValue
+double maxValue
+String unit
+double currentValueFontSize
+build(BuildContext context)
-_buildGauge(size, gaugeValue, fontSize, errorFontSize)
-_buildAnimatedGauge(size, gaugeValue)
-_buildCenterDisplay(size, fontSize, errorFontSize)
-_buildTickMarks(size)
}
class Instrumentstats {
+build(BuildContext context)
}
class StatItem {
+String label
+double value
+double fontSize
+build(BuildContext context)
}
GaugeWidget <|-- Instrumentstats : uses
Instrumentstats *-- StatItem
File-Level Changes
Assessment against linked issues
Possibly linked issues
Tips and commandsInteracting with Sourcery
Customizing Your ExperienceAccess your dashboard to:
Getting Help
|
![sourcery-ai[bot]](https://avatars.githubusercontent.com/in/48477?s=60&v=4){kind=small}
There was a problem hiding this comment.
Hey @Yugesh-Kumar-S - I've reviewed your changes - here's some feedback:
- Avoid using IntrinsicHeight inside the SingleChildScrollView in Instrumentstats—consider using a ListView with shrinkWrap or Flexible/Expanded to achieve a scrollable, adaptive layout without the performance overhead of IntrinsicHeight.
- GaugeWidget has a lot of hard-coded clamp ranges and magic numbers—extract those into named constants or parameters (or move to theme/dimens) to improve readability and make future adjustments easier.
- The build method in GaugeWidget is quite large; consider splitting the adaptive size calculations and widget composition into smaller, self-contained widgets or helper classes to simplify maintenance and testing.
Prompt for AI Agents
Please address the comments from this code review:
## Overall Comments
- Avoid using IntrinsicHeight inside the SingleChildScrollView in Instrumentstats—consider using a ListView with shrinkWrap or Flexible/Expanded to achieve a scrollable, adaptive layout without the performance overhead of IntrinsicHeight.
- GaugeWidget has a lot of hard-coded clamp ranges and magic numbers—extract those into named constants or parameters (or move to theme/dimens) to improve readability and make future adjustments easier.
- The build method in GaugeWidget is quite large; consider splitting the adaptive size calculations and widget composition into smaller, self-contained widgets or helper classes to simplify maintenance and testing.
## Individual Comments
### Comment 1
<location> `lib/view/widgets/instruments_stats.dart:26` </location>
<code_context>
- fontWeight: FontWeight.bold,
+ return LayoutBuilder(
+ builder: (context, constraints) {
+ final availableHeight = constraints.maxHeight;
+ final titleHeight = titleFontSize * 1.5;
+ final remainingHeight = availableHeight - titleHeight - 16;
+
+ return Column(
</code_context>
<issue_to_address>
Calculation of remainingHeight may result in negative values.
If availableHeight is less than titleHeight + 16, remainingHeight becomes negative, which may cause layout issues. Consider explicitly handling this case, such as by enforcing a minimum overall height or providing a fallback layout.
</issue_to_address>
<suggested_fix>
<<<<<<< SEARCH
return LayoutBuilder(
builder: (context, constraints) {
final availableHeight = constraints.maxHeight;
final titleHeight = titleFontSize * 1.5;
final remainingHeight = availableHeight - titleHeight - 16;
return Column(
=======
import 'dart:math' as math;
return LayoutBuilder(
builder: (context, constraints) {
final availableHeight = constraints.maxHeight;
final titleHeight = titleFontSize * 1.5;
final remainingHeight = math.max(0, availableHeight - titleHeight - 16);
if (availableHeight < titleHeight + 16) {
// Fallback layout or message when not enough space
return Center(
child: Text(
'Not enough space to display content.',
style: TextStyle(fontSize: titleFontSize),
),
);
}
return Column(
>>>>>>> REPLACE
</suggested_fix>Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.
Comment on lines
+24
to
+30
| return LayoutBuilder( | ||
| builder: (context, constraints) { | ||
| final availableHeight = constraints.maxHeight; | ||
| final titleHeight = titleFontSize * 1.5; | ||
| final remainingHeight = availableHeight - titleHeight - 16; | ||
|
|
||
| return Column( |
There was a problem hiding this comment.
suggestion: Calculation of remainingHeight may result in negative values.
If availableHeight is less than titleHeight + 16, remainingHeight becomes negative, which may cause layout issues. Consider explicitly handling this case, such as by enforcing a minimum overall height or providing a fallback layout.
Suggested change
| return LayoutBuilder( | |
| builder: (context, constraints) { | |
| final availableHeight = constraints.maxHeight; | |
| final titleHeight = titleFontSize * 1.5; | |
| final remainingHeight = availableHeight - titleHeight - 16; | |
| return Column( | |
| import 'dart:math' as math; | |
| return LayoutBuilder( | |
| builder: (context, constraints) { | |
| final availableHeight = constraints.maxHeight; | |
| final titleHeight = titleFontSize * 1.5; | |
| final remainingHeight = math.max(0, availableHeight - titleHeight - 16); | |
| if (availableHeight < titleHeight + 16) { | |
| // Fallback layout or message when not enough space | |
| return Center( | |
| child: Text( | |
| 'Not enough space to display content.', | |
| style: TextStyle(fontSize: titleFontSize), | |
| ), | |
| ); | |
| } | |
| return Column( |
|
Build successful. APKs to test: https://github.com/fossasia/pslab-android/actions/runs/16100143653/artifacts/3472341873 |
|
@AsCress Do you think making the instrumentStats widget scrollable is a good idea here? Do you have any suggestion... |
Yugesh-Kumar-S
changed the title
|
@Yugesh-Kumar-S Depends on how we're aiming to target larger screens: do we want to create alternate layouts for large screen sizes or if we want to tweak our existing ones to support large screen sizes. |
|
@AsCress @CloudyPadmal @marcnause Please have a look at this desktop layout design. Is it a good approach? Screen.Recording.2025-07-06.184854.mp4 |
I am no expert in layouts (especially not Flutter), but I think this layout should work nicely with desktop apps and it might also be an improvement for phones and tables in landscape mode. |
|
@Yugesh-Kumar-S This one is much better. Let's go ahead with this style only: for larger screen sizes, we stack the widgets horizontally. |
Yugesh-Kumar-S
added
flutter
Status: Review Required
CloudyPadmal
approved these changes
Jul 6, 2025
AsCress
approved these changes
Jul 7, 2025
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes #2764
Changes
Screenshots / Recordings
Checklist:
strings.xml,dimens.xmlandcolors.xmlwithout hard coding any value.strings.xml,dimens.xmlorcolors.xml.Summary by Sourcery
Adapt gauge and instrument stats widgets to handle smaller window sizes by adding adaptive sizing and scrollability
Bug Fixes:
Enhancements: