Groceries 3.0: Now with 100% moar Angular

[tjvantoll]

I want to complete the Groceries implementation currently in the “angular” branch, make it “master”, and get the new app out in the stores. Here are the necessary steps:

• Add animations on the login screen
• Better keyboard management
• Implement “Forgot Password” functionality
• Disable login form while submitting
• Better alert titles
• Add support for “Recent” groceries
• Start the user on the list screen if they’ve already authenticated
• Check boxes for toggling state of each grocery
• Use ngIf for handling visibility changes
• text-transform for uppercase on Android
• Clear the history stack when navigating
• Integrate UI for {N}
  • RadSideDrawer for “options”
  • Transparent RadListView
• Integrate a simple unit test setup
  • Figure out why the iOS tests don’t work
• Tag 3.0
• Release 3.0 to Google Play
• Release 3.0 to the iOS App Store

[mikelunn]

Would it be possible to implement the swipe to delete on the list view element. I'm trying to implement it using the code from the JS branch but can figure it out. I'm grabbing a reference to the ListView element using the @ViewChild annotation, then calling swipeToDelete.enable(listView,cb) in ngOnInit function after list load event. Can this be accomplished on the angular2 list view component?

[tjvantoll]

Hey @mlunn01,

Yep it should be possible. I’m personally planning on using Telerik UI NativeScript’s RadListView to add the swipe behavior (which is free btw).

The only reason I haven’t implemented it yet is UI for {N} doesn’t yet support Angular 2 RC1, but it should in the next week or so. Once that release is out I plan to implement it in Groceries.

[mikelunn]

Thanks for the quick response. It's been really interesting learning Nativescript and Angular2 in a single tutorial. Looking forward to the added Angular2 support.

[DarthVictor]

Hey @tjvantoll I am sorry for offtoping, but can explain how "Clear the history stack when navigating" can be implemented using the current Router, I tryed
var frameModule = require("ui/frame");
var topmost = frameModule.topmost();
return topmost.navigate({ moduleName: "LoginPage", clearHistory: true })

but it doesn't work with Router

[tjvantoll]

Hey @DarthVictor,

No worries. Currently it’s not possible, which is why the task isn’t complete here. We have been waiting for Angular to release their new router to implement this (so that we don’t have to do it twice), and since they just announced that we’re going to be actively working on adding support for that router, along with the ability to clear the history stack over the next few weeks. You can follow NativeScript/nativescript-angular#218 for updates.

[DarthVictor]

Thank you, @tjvantoll
I've found that the problem now in function resolvePageFromEntry in ui/frame in the line
throw new Error("Failed to load Page from entry.moduleName: " + entry.moduleName);
Unfortunately I tried about ten names (such as "../pages/login/login.component" or "./pages/login/login.component.LoginPage" or other names) but without any success.
I also used Page object through Angular DI
constructor(...private _page: Page, ...)
this._page.frame.navigate

[rijine]

waiting..:(

[tjvantoll]

@rijine @DarthVictor Just fyi these APIs are now available https://docs.nativescript.org/angular/core-concepts/navigation-angular.html#clearing-page-navigation-history

[swapneshran]

@tjvantoll

I can see item "Transparent RadListView" is yet to be done.

We have started working on nativascript with angular 2. We are trying to do transparent radlist view .

It is not working in iOS only. We have tried to implement the same with List view. Still the result is same .

Also in Groceries app code is written for making transparent background for list view . But i could not see that in the application image.
makeBackgroundTransparent(args) { let cell = args.ios; if (cell) { // support XCode 8 cell.backgroundColor = utils.ios.getter(UIColor, UIColor.clearColor); } }

Is it still in progress(making transparent list view) or there is any way to do transparent background for list view in iOS.

Regards
Swapnesh

[ScreamZ]

What about this release ?

Thanks

[tjvantoll]

The vast majority of features in this issue have already been implement in the master branch. The remaining ones will be tackled through separate issues. Closing this issue.