| Dbrant | |
| Nov 23 2016, 5:14 PM |
| F6858621: Screenshot_20170322-094212.png | |
| Mar 22 2017, 4:47 PM |
| F6827787: T151468.png | |
| Mar 21 2017, 9:15 PM |
| F6622659: main-MainActivity-03162017140513.png | |
| Mar 16 2017, 1:09 PM |
| F6622657: main-MainActivity-03162017140554.png | |
| Mar 16 2017, 1:09 PM |
| F5789569: Artboard.png | |
| Feb 23 2017, 12:25 PM |
| F5776326: Screen Shot 2017-02-22 at 3.42.54 PM.png | |
| Feb 22 2017, 8:50 PM |
| F4992969: Screenshot_20161205-174527.png | |
| Dec 6 2016, 1:48 PM |
| F4992934: Text selection menu.png | |
| Dec 6 2016, 1:48 PM |
The first edit pencil at the top of the article should pop up a menu with options to "Edit title description" and "Edit introduction". If the article already has a description, it should no longer be clickable (it should be editable only via the edit pencil).
Mock:
https://zpl.io/1veAQl
| Status | Subtype | Assigned | Task | ||
|---|---|---|---|---|---|
| Resolved | • Mholloway | T151468 Enable the first "edit" pencil to allow editing the description, as well as the first article section. | |||
| Resolved | cooltey | T160753 Fix alignment of the first edit pencil on articles | |||
| Resolved | Sharvaniharan | T183018 [BUG] Edit icons shown on article section headings are too big and are misaligned | |||
| Duplicate | None | T186769 Edit pencil icon misalignment on subtitles |
Change 323314 had a related patch set uploaded (by Dbrant):
Make the first edit pencil serve a dual purpose.
Change 323314 merged by jenkins-bot:
Make the first edit pencil serve a dual purpose.
Looking good @Dbrant – just noticed a few things:
1. Edit icon
Actual  | Expected (with redlines)  |
| Icon is ~28dpx28dp | Icon is a smaller 24dp x 24dp |
| Icon is in line with the last line of the wikidata description text, which is 16dp from the horizontal divider line | |
| More space (24dp) between icon and RHS edge of screen | |
2. Edit menu
Actual  | Expected (with redlines)  |
| Shadow cast is larger than expected (seem more like the shadow for a dialog) | Menu should cast a smaller shadow |
| Background color is #FAFAFA | Background color is #FFF |
| Menu is cut-off on the RHS edge of screen | Menu animates from icon with 8dp spacing from edge of menu to corresponding sides of the icon, and 16dp from RHS edge of screen. |
Hey @Dbrant – the above visual design feedback still applies on the latest alpha version 2.4.184-2017-01-31.
One tricky issue I've noticed with moving the (floating) edit pencil up within the header view as shown in F4992934 is that, on some articles on some devices/configurations, this puts it up where it's in danger of obscuring description text:
Its current placement on master overlaps the description TextView only marginally so that this isn't an issue.
I'm not sure how best to handle this. I don't think there's any viable way to get the description text to wrap around the separate, floating view. I guess we could switch things up so that the description textview and edit pencil are neighbors within a LinearLayout, though I'm not sure how straightforward that will be to make RTL-friendly.
Change 339327 had a related patch set uploaded (by Mholloway):
Update section edit pencil styles
Sorry the mock wasn't clear, but the intention is that the block for the description text should end before the icon:
Change 339428 had a related patch set uploaded (by Mholloway):
Update page header view edit pencil/popup menu styling
Thanks, @RHo. I imagined we'd have to do something like that. It took a bit more rearranging than it would appear from the outside but ended up being pretty painless.
Questions for @RHo:
Sorry @Dbrant, we can leave the menu as default shadow and color – I think I mixed up shadow and color with the default card style.
Change 339428 merged by jenkins-bot:
[apps/android/wikipedia] Update page header view edit pencil/popup menu styling
Change 339327 merged by jenkins-bot:
[mediawiki/extensions/MobileApp] Update section edit pencil styles
Change 341012 had a related patch set uploaded (by mholloway-shell):
[apps/android/wikipedia] Update section edit pencil styles
Change 341012 merged by jenkins-bot:
[apps/android/wikipedia] Update section edit pencil styles
Hi @Mholloway - looks like the Description is still going all the way to edge into the pencil icon area, and is still sitting below rather than adjacent and bottom aligned to the title description text:
 |  |
Occurring on: 2.5.190-alpha-2017-03-16
Device: Pixel
Android Version: 7.1.1
Hi @RHo, thanks for looking over the changes. We ended up merging something of a compromise patch[1] because making a layout completely faithful to the mock requires RTL layout support that isn't present in the platform until API level 17 (currently, we're supporting down to 16). OK to revisit when we drop API 16 support?
[1] Discussion here: https://gerrit.wikimedia.org/r/#/c/339428/
no worries @Mhholloway – I just created a separate ticket to track the display issue, and this is ready for QA.
Steps to reproduce
Expected
Overflow menu should appear with options to "Edit title description" and "Edit introduction"
Testing on Samsung Galaxy Express 3 (J120A) with Android 6.0.1 and Wikipedia Alpha app 2.5.190-alpha-2017-03-21. This is fixed according to @RHo steps leading to the Expected result as shown in the screencap
Tested on a Pixel with Android 7.1.1 and the Alpha App 2.5.190-alpha-2017-03-22
Looked at locked, unlocked, long, short, and no description. Everything appears to work properly
There is something problematic about the Milky Way example. In some cases, when I view this article the description is on one line and it looks very similar to the screenshot in @RHo added above.
