Unexpected vertical lines between container elements of a row
The issue is happening because container child is not aligned with physical pixels. This is of course possible but android LinearLayout in similar case adjusts some children width so in total whole container is filled. It is difficult to judge what approach is correct, but it would be nice for flutter to have at least option to measure children like android does.
At this moment the best workaround for me is to measure children manually like this:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | int CHILDREN_COUNT = 7; List<Widget> children = new List(CHILDREN_COUNT); MediaQueryData mediaQueryData = MediaQuery.of(context); int physicalWidth = (mediaQueryData.size.width * mediaQueryData.devicePixelRatio).floor(); for (int i = 0, pixelsLeft = physicalWidth; i < CHILDREN_COUNT; i++) { int columnWidth = (pixelsLeft / (CHILDREN_COUNT - i)).floor(); children[i] = new Container( width: columnWidth / mediaQueryData.devicePixelRatio, color: color, ); pixelsLeft -= columnWidth; } |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.