daniel-stoneuk / material-about-library

Makes it easy to create beautiful about screens for your apps
Apache License 2.0
1.12k stars 140 forks source link

Suggestion: Align title and non-title elements #79

Closed code-schreiber closed 6 years ago

code-schreiber commented 6 years ago

One of the first things that I noticed when creating an about screen with a MaterialAboutTitleItem and a MaterialAboutActionItem is that the icon and text of the title item are not aligned with the icon and text of the action item. A possible solution could be based on margins, after all, the title image should still be bigger than the other ones.

I tried to illustrate the issue with a screenshot where the blue lines belong to the title and the red ones to the action item.

screenshot with grid

I am aware that this is not going to be an issue for everyone but I believe this change will make many eyes happy 👀

daniel-stoneuk commented 6 years ago

Hi,

Good spot. I think I tried a couple different combinations but this was the most eye pleasing. Part of the issue is that the app icon may be wider than the one in the demo, in this case what will it look like.

I will mess around with different designs, post them here and we can decide on the best.

Thanks.

daniel-stoneuk commented 6 years ago

screen shot 2018-04-06 at 14 35 06

You're right, I quite prefer the "new" design. Thanks.

I'll commit if you don't have any other design ideas.

code-schreiber commented 6 years ago

The "new" design looks very nice! 👍

The only thing that I would consider changing is the spacing for the smaller icons, now it seems too big to left and right. I'm aware that the app icon is usually bigger and that influences the spacing of the whole screen, so my suggestion would be to reduce the spacing of both app and non-app icons. Other than that thanks for this change!

Be aware that this is a breaking change in terms of design and it should be very clear for library consumers that their screens will potentially look a bit different after updating.

daniel-stoneuk commented 6 years ago

Yeah, I see what you mean.

If we did decrease the spacing of both types of icon, I believe that the title icon will be too near the edge of the card. This is assuming we want the action icon to be centered with the title icon.

It does seem like material design is heading towards more whitespace and the extra spacing doesn't feel too out of place. It definitely looks better than the original.

Good point about breaking changes. I'll make that clear.

After testing however, it doesn't look that bad with reduced title padding:

image

code-schreiber commented 6 years ago

Nice 🎉

daniel-stoneuk commented 6 years ago

Now in Release 2.3.0! Thanks again.