Push and pop in react native - android

I am new in react native , i have create several screens in react native. but i am facing problem in navigating between pages.
We have to manage the stack and stack index with own ??
Without defining the Route in Apps.js can we navigate to other pages ??
I followed these tutorials but didn't get simple ways to navigate through pages .
https://facebook.github.io/react-native/docs/navigation.html
https://reactnavigation.org/docs/intro/
As in ios we write
Jump to new pages :
[self.navigationController pushViewController:vc animated:YES];
Back to previous pages :
[self.navigationController popViewController animated:YES];
(pushing controller to stack and pop controller from stack is managed by UINavigationController it self )
My Question is :
1.What is the easiest or Proper way to implement the navigation in react native ?.
How can we Set Animated property like in ios ?
Please help me , thanks in advance :)

The most popular way of implementing navigation is by using React-Navigation.
You need to explain how is it in iOS. If you need to perform animation on the component, screen or navigaiton, you use Animated library or Layout Animation of React-Native.

Related

How should I implement navigation between fragments in Flutter?

I have a native Android app that I am translating to Flutter, and I am not sure that I'm on the right track. I implemented the bottom navigation bar functionality by following the documentation, but I'm not sure what's the best way to navigate between what were Fragments in the native android project. For every widget I select with the BottomNavBar, I need further "pages", while the BottomNavBar has to stay on the screen, and I also need to pass data further "down" the navigation graph.
I thought about creating a custom widget which stores the subpage you are on, same way as I did with the BottomNavBar, but this seems like a hack, especially that I would also have to store the parameters that I have to pass to the new "fragment", and the pages should keep their state after navigating away and back.
Is there a better way to implement this functionality?
I use the IndexedStack as this article elaborates. I think it's probably a good solution.
https://pub.dev/packages/persistent_bottom_nav_bar/
It occurred to me after asking that I should check for a package, and here it is, does what I need.

How to implement a tutorial with Drawer Navigation

I'm not an Android ninja developer and I'd like to implement an app which has a Drawer Navigation and includes a tutorial.
Basically if you are in "My App" you should see a 5-6 steps tutorial.
The question is:
How can I implement that app?
I'd like to know how to organize it and which components I should use.
I'd really appreciate a step-by-step guide.
Thanks a lot.
This is a weird mockup of what I'm trying to implement :)
You can make an activity on top of drawer and then you can simply put view pager in Activity for tutorial. When user will finish tutorial you can move user to Drawer Navigation.
So you can use following method.
Check if user is visiting application for first time then show tutorial activity then move to Navigation Drawer. If user is visiting application for second time or more then you can directly move user to Navigation Drawer and start app.
If your tutorial is for the overall app, Jayesh's answer is right: you should put it in a separate Activity.
If the tutorial only demonstrates part of your app, i.e. only the drawer your are in, I suggest you use:
One MainActivity with a DrawerLayout. The latest SDK tools have a real cool template for NavigationDrawer, that will save you a lot of time!
In your TutorialFragment, write a layout with a ViewPager and the fixed bar at the bottom.
Add pages for your tutorial to this ViewPager.

Sliding in the android app home screen

I am looking to create an app where some categories that the user can choose from will be shown. The best UI I could find is shown in this image:
https://lh3.ggpht.com/swzmwICOMNjKmLH_HyAWh0VQ49BN7vU6PG3qEpsSnF1HWcG1CmpQi1BTBxdVczZx8pY
The screenshot is of the "Parenting Ages & Stages" android app. The best part of the above shown home page is that there is no scroll bar at the bottom and the user can use swipe gestures to see various categories.
Any idea how I can achieve the same effect?
It would be better to use ViewPager in your case
http://developer.android.com/reference/android/support/v4/view/ViewPager.html
It may Help you!

Phonegap android application div bg image

I am very new to android application and I made a simple android application using Phonegap.
I created some pages and linked correctly, Its working fine and I would likes to add page transitions as in many applications.
Please help me how to add those transitions. i.e. When a user clicks in the link and this page will slide left and has to show the upcoming page.
Use
$.mobile.changePage('#pageid', {
transition : "none",
reverse : true,
changeHash : true
});
to change page. define desired transition here
I think you can either use any jQuery slide transition or the best way is to use the MobileJquery Framework
in which you will have a lot of options to customize. Click here for more details www.jquerymobile.com

TabHost and PhoneGap

I'm trying to add native tabs to my phonegap application on Android.
I have a way of doing it where each tab has it's own Activity and use loadUrl to load Phonegap in the view but it raises two problems.
I'm afraid the app is going to be
awfully slow if I have 5 tabs each
running Phonegap with some
javascript.
If I go back to a tab,
the last instance state has been
saved, so if i clicked on a link
from the tab, clicking back on the
tab doesn't load back the main page.
I'm thinking about creating a layout main.xml with a custom linear layout and some callback buttons to call something like : super.loadUrl("javascript: goTo page rand;"); but I'm not sure this is the best way since I would have to rewrite the tabs functionality and design.
Thanks !
Do you really need the tabs to be native because of some architectural constraint? If not how about using a framework like Sencha Touch which provides tab UI controls? There's a demo in the kitchensink code:
http://dev.sencha.com/deploy/touch/examples/kitchensink/
The framework works pretty well from what I've seen inside of Phonegap.

Categories

Resources