[ALOY-962] Menu control doesn't appear in Todo sample on Android
GitHub Issue | n/a |
Type | Bug |
Priority | High |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2014-04-15T13:55:03.000+0000 |
Affected Version/s | n/a |
Fix Version/s | Alloy 1.4.0, 2014 Sprint 08 |
Components | Samples & Templates |
Labels | qe-testadded |
Reporter | Tim Statler |
Assignee | Tim Poulsen |
Created | 2014-02-21T01:36:25.000+0000 |
Updated | 2014-05-09T00:54:27.000+0000 |
Description
Steps:
1. In Studio import the Alloy Todo sample and build for Android.
Results: Menu for All, Active, Done options doesn't appear.
Expected: Menu appears.
Attachments
The sample sets
navBarHidden: true
in index.tss, which explains it. Setting it tofalse
fixes the original problem but the navbar + header bar combination looks a bit unorthodox. It seems the Android version should exclude the header view and use the action bar exclusively to add/filter items.PR: https://github.com/appcelerator/alloy/pull/350 I implemented the ActionBar and menu, pinning the Add item to the action bar and forcing the rest to the menu. I replaced the PNG for the Add button with the Android R drawable to properly support multiple resolutions. While I was at it, I tweaked the TSS so the app looks better on iOS7. Functional test: 1. Create a new Alloy project. 2. Copy the app folder from test/apps/models/todo though you'll want to keep the assets folder intact from the stock template or the app will run letter-boxed on iOS7 and be missing icons/splash screens on all platforms. 3. Run the app for Android. It should implement the action bar as described above. 4. Run the app for iPhone. If you preserved the assets folder, the app should fill the screen but not cover the status bar.
I left a comment in the PR regarding the tableTop style pushing the table down too far on Android. On my Galaxy S4 (Android 4.4.2) the hidden MenuItems (All/Done/Active) aren't accessible (see attached) because the drop-down menu control doesn't appear. It appears as expected on a Genymotion Android 4.3 emulator (see other image).
It works fine on my Galaxy Nexus (4.2.2).
The "overflow menu" (three-dots) appears only on devices without a physical menu button. The S4 has such a button, the Nexus and Genymotion emulator also tested with do not. So, the behavior [~tstatler] describes is "expected behavior." There are ways to force the overflow menu, such as https://github.com/ricardoalcocer/actionbarextras
Thanks for the info, Tim. I've created a ticket to add this info about the overflow to our Android Menu docs (TIDOC-1595).
PR merged Functional review can also be done with jake:
jake app:run dir=models/todo platform=android
There were minor UI tweaks for iOS too. So, alsojake app:run dir=models/todo
Verified the fix. We see the menu control on android & iOS. Closing. Environment: Appc Studio : 3.3.0.201405011408 Ti SDK : 3.3.0.v20140508101423 Mac OSX : 10.8.5 Alloy : 1.4.0-dev CLI - 3.3.0-dev Nexus 5 - android 4.4.2 Iphone 5 - iOS 6.1.3