Improve Flutter UI

[calcitem]

How about learn from Doublemill3?

https://m.apkpure.com/doublemill-3-nine-men-s-morris/com.plusonelabs.doublemill3

In terms of functionality, the ultimate goal is to make an app similar to SmallFish.

[Leptopoda]

regarding #345 why not deactivate the status bar all together? Or use an AppBaer with elevation 0 so it blends into the screen? I also think the problem is caused by UI override. What was the reason you implemented it? I know of the horizontal only UI...

[calcitem]

The initial version did not display the status bar, because the following bug could not find a solution, so I modified to display it.

https://github.com/calcitem/Sanmill/issues/240

[Leptopoda]

ok Thanks for mentioning it.

[Leptopoda]

I just finished the fix for #351 which also adjusts the responsiveness of the drawer.

Until now you had the title of the appBar centered (and I guess to avoid clipping with the Icon). The material design guideline wants the title to be aligned to the side. Is it ok to change that design element or would you like it to stay the old way??

EDIT:

[calcitem]

Just a quick one!

Is it OK to change the title bar design element!

[calcitem]

The drawer cannot respond to gestures.

It is expected that sliding from right to left on the drawer can close the drawer.

Many apps are designed like this, including Doublemill 3 and bierverkostung and Outlook.

[Leptopoda]

Can you elaborate the bug?

It works fine for me? You have to slide over a specific threshold (iirc 20% of the range) or you need to slide fast enough. This is to prevent accidental closure.

Is this what you see?

[calcitem]

Doublemill3 slides from point A to point B in the drawer area to close the drawer, but Sanmill cannot.

[Leptopoda]

Ok I'll change that

[Leptopoda]

now on dev

[calcitem]

It works! So quickly！ Thanks！

[calcitem]

I originally wanted to design the Game Page's GUI to mimic the SmallFish on iOS.

The first phase of development is complete, and the analysis chart and move list are not developed yet, so if I put the toolbar at the bottom of the screen, the middle is too empty. So I moved the toolbar up, as same as the ChessRoad.

As for why the header follows the board, it's a similar consideration. If we move the board down, the middle will be empty.

The board is not centered because the original version was centered, but an Iran user feedback that had long phones, and his fingers couldn't reach the board, so he wanted me to provide the ability to adjust the board position.

Further, I want to follow the SmallFish layout and add options to allow users to adjust the order of each GUI module from top to bottom, including header, board, analytics/move list, toolbar, etc. Further, it would be cool to allow the user to adjust the order by dragging and dropping. Of course, according to my current Flutter beginner level, it is more challenging to complete this effect, haha.

[Leptopoda]

I don't think more options are better. I think it's quite otherwise. People just want to play mill. Nothing more. Giving the user more options will just lead to users ignoring the settings altogether...

Sometimes simplicity is better than something cluttered

[calcitem]

Three reviews on the Google Play Store affirmed the highly configurable, and some emails sent through the Feedback function also confirmed this.

In short, the users of this App are professional, and the route of more configurable items will continue to go down.

Of course, the default configuration can be discussed.

Reviews of Google Play Store:

Antonio Bellini

The APP Mill by Calcitem Studio is fantastic. By far the best I tested. Plays very well and it is highly configurable Thanks a lot.

Lisa Suchanek

Excellent! Great way to learn the game, with a lot of options and clear presentation.

Jesuel Orihuela

Es genial, con un buen diseño y opciones para personalizarlo

[calcitem]

Some feedback about UI.

These screenshots show that some users keep the default settings, some users adjust the board to the center, and some adjust it closer to the bottom. Therefore, we cannot predict what the user will choose. More options are provided for insurance. And some users want us to add more configurable items.

[calcitem]

Discuss how to modify the GUI layout of the subsequent game page?

My idea: Two modes can be provided in the follow-up: simple and advanced modes. The simple mode imitates the layout of Doublemill 3, which is suitable for children, and the advanced mode emulates the design of SmallFish, which is ideal for professional players. The advanced mode is developed first and then derived Simple mode.

The horizontal line in the middle of the Header must be removed.

[calcitem]

After thinking about it, I can agree to delete the top setting. If a player wants to move the board closer to his hand for easy operation, he can turn the phone over to operate it, haha.

[Leptopoda]

I think that many "customizations" that you added are more to fix bugs with the layout itself than actually customizing the game.

Examples would be the board offset or the piece width. I think we should find better layouts and sizes so one wouldn't even have to change them. I would also say that the same applies to other settings but those two are the most prominent.

[calcitem]

Perhaps, we can redesign the layout and discuss it with the users who follow this app closely. On the Telegram group.