How to work around using the colorpicker inside an alertdialog on a small phone (e.g. nexus5)

[gizmomogwai]

03-10 15:24:00.632  1140  1178 I flutter : ══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
03-10 15:24:00.641  1140  1178 I flutter : The following message was thrown during layout:
03-10 15:24:00.641  1140  1178 I flutter : A RenderFlex overflowed by 43 pixels on the right.
03-10 15:24:00.671  1140  1178 I flutter : The overflowing RenderFlex has an orientation of Axis.horizontal.
03-10 15:24:00.671  1140  1178 I flutter : The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and
03-10 15:24:00.671  1140  1178 I flutter : black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
03-10 15:24:00.671  1140  1178 I flutter : Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the
03-10 15:24:00.671  1140  1178 I flutter : RenderFlex to fit within the available space instead of being sized to their natural size.
03-10 15:24:00.671  1140  1178 I flutter : This is considered an error condition because it indicates that there is content that cannot be
03-10 15:24:00.671  1140  1178 I flutter : seen. If the content is legitimately bigger than the available space, consider clipping it with a
03-10 15:24:00.671  1140  1178 I flutter : ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex,
03-10 15:24:00.671  1140  1178 I flutter : like a ListView.
03-10 15:24:00.671  1140  1178 I flutter : The specific RenderFlex in question is:
03-10 15:24:00.671  1140  1178 I flutter :   RenderFlex#0d25a relayoutBoundary=up1 OVERFLOWING
03-10 15:24:00.671  1140  1178 I flutter :   creator: Row ← Column ← ConstrainedBox ← Container ← ColorPicker ← _SingleChildViewport ←
03-10 15:24:00.671  1140  1178 I flutter :   _ScrollableScope ← IgnorePointer-[GlobalKey#66b26] ← Semantics ← Listener ← _GestureSemantics ←
03-10 15:24:00.671  1140  1178 I flutter :   RawGestureDetector-[LabeledGlobalKey<RawGestureDetectorState>#cd00a] ← ⋯
03-10 15:24:00.671  1140  1178 I flutter :   parentData: offset=Offset(0.0, 271.0); flex=null; fit=null (can use size)
03-10 15:24:00.671  1140  1178 I flutter :   constraints: BoxConstraints(0.0<=w<=232.0, 0.0<=h<=Infinity)
03-10 15:24:00.671  1140  1178 I flutter :   size: Size(232.0, 78.0)
03-10 15:24:00.671  1140  1178 I flutter :   direction: horizontal
03-10 15:24:00.671  1140  1178 I flutter :   mainAxisAlignment: center
03-10 15:24:00.671  1140  1178 I flutter :   mainAxisSize: max
03-10 15:24:00.671  1140  1178 I flutter :   crossAxisAlignment: center
03-10 15:24:00.671  1140  1178 I flutter :   textDirection: ltr
03-10 15:24:00.672  1140  1178 I flutter :   verticalDirection: down
03-10 15:24:00.672  1140  1178 I flutter : ◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤
03-10 15:24:00.672  1140  1178 I flutter : ════════════════════════════════════════════════════════════════════════════════════════════════════

[mchome]

It should work in new version :)

[gizmomogwai]

looks better now on nexus5x, but nexus5 still has problems for you.
i am working with version 0.0.2 now, you might also want to tag the github repository :)

nexus5x screenshot

nexus5 screenshot:

[mchome]

It should work better in new version :)

[gizmomogwai]

Thanks a lot ... that are the fastest github answers I got like ever :)
Just a question in general (because I am new to flutter and its layouts):
Is it possible, to make the colorthing as wide as possible and adjust the height accordingly, to always get a square color area?

I think this would make sense, because you are suggesting to use a vertical scroller anyways.

[mchome]

Oh, i add some parameters like colorPickerWidth and colorPainterHeight in the latest version. You can use them to control the widget width and color area height.
If you like to get a square color area in AlertDialog, i can add a parameter to achieve it:)

[gizmomogwai]

i saw that ... the question is, if it would be possible with flutter to auto adjust the width (until a nice maximum) and automatically make the height the same.

[mchome]

this is 720p device

this is 2k device

and a tablet

Is it you want?

[gizmomogwai]

wow .. this looks really good ... i think this makes sense....
the only thing that i could imagine is, that for a really big tablet or something in landscape mode, one might want to be able to specify a maximum size ... because if its filling the whole screen this might be too much :)

[mchome]

In new version, you can use pickerAreaHeightPercent to control the ratio on the picker area, default value is 1.0(square).
The orientation value generated by Orientation orientation = MediaQuery.of(context).orientation;, so it is convenient to change the widget width depending on orientation :)

[gizmomogwai]

I tested on my two real devices and it looks really good ... sorry for bothering you so long, and thank you very much!