Description

Try out react-navigation now with this awesome playground

Comments (71)

Xi Huang

@yumiko

Love it!

3 weeks ago

Branislav Petrovic

@bpkinez

Awesome demo guys! Keep it up!

1 month ago

Luke Brown

@lukexf

Why can't we load the app? I'm getting "Sorry, you are not allowed to load 'NavigationPlayground'" as well.

2 months ago

Brent Vatne Maker on Expo

@notbrent

@lukexf - https://blog.expo.io/upcoming-limitations-to-ios-expo-client-8076d01aee1a you need to open it in simulator on iOS

2 months ago

reactnatively Maker on Expo

@reactnatively

I can not get to this app using Expo. I'm getting "Sorry, you are not allowed to load 'NavigationPlayground'"

2 months ago

Brent Vatne Maker on Expo

@notbrent

@reactnatively - https://blog.expo.io/upcoming-limitations-to-ios-expo-client-8076d01aee1a you need to open it in simulator on iOS

2 months ago

Nik Syazwani

@niksyazwani

hi, why i cant install react-navigation says hat my project name same as the depencies name? is there any solution because i tried to google but seems there is no answer. thank you!

3 months ago

Brent Vatne Maker on Expo

@notbrent

@niksyazwani - probably your project is called react-navigation. make a different project with a name that isn't the same as a npm package that you use ;)

2 months ago

Allen Yang

@allenyang

The official demo is setup with Expo. If you don't want to use Expo you could check out my clone of the demo (https://github.com/shentaoy/react-navigation-example ) which is a standard React Native App.

3 months ago

Brent Vatne Maker on Expo

@notbrent

@allenyang - thanks for setting that up!

2 months ago

ycrathi Maker on Expo

@ycrathi

How to download source code ?

4 months ago

CZ Hacery Maker on Expo

@chrismtoth

Anyone getting this error when trying to start the project via yarn? error An unexpected error occurred: "Reduce of empty array with no initial value".

4 months ago

Brent Vatne Maker on Expo

@notbrent

@chrismtoth - that's a bug with yarn 1.7.0 - https://github.com/yarnpkg/yarn/issues/5876

4 months ago

CZ Hacery Maker on Expo

@chrismtoth

I downloaded the source and I'm trying to run it using an Android Virtual Device. I tried running "react-native run-android" in the 'react-navigation-master' folder and got a "Android project not found". I then tried "react-native start" and it hangs on "Loading dependency graph, done". So how do you start this on an android virtual device? Thanks!

4 months ago

Brent Vatne Maker on Expo

@notbrent

@chrismtoth - run `yarn` then run `yarn start`

4 months ago

CZ Hacery Maker on Expo

@chrismtoth

@notbrent thanks, that got me a little farther. After installing yarn, I get this series of messages after running "yarn start" D:\rn\react-navigation-master (react-navigation@2.6.2) λ yarn start yarn run v1.7.0 $ npm run ios So it looks like it's defaulting to "ios" Is there a way to get it to run on an Android Virtual Device? Thanks!

4 months ago

ycrathi Maker on Expo

@ycrathi

@chrismtoth how to download source code ?

4 months ago

Brent Vatne Maker on Expo

@notbrent

@ycrathi - https://github.com/react-navigation/react-navigation - go to examples/NavigationPlayground

2 months ago

Daniel Caris Maker on Expo

@daniel.caris

I can´t open this demo in iOS with the last version expo client

4 months ago

Cecep Qwords

@cecepqwords

@daniel.caris same problem here.

4 months ago

jankeesvw Maker on Expo

@jankeesvw

Same; "Not allowed to load project"

4 months ago

Jarne Uytersprot

@jarneuyt

@daniel.caris Same here: "Sorry, you are not allowed to load ..."

3 months ago

vermaruby38

@vermaruby38

@jarneuyt No, I don't think so! http://clickerheroes.co

5 days ago

Brayan Loayza Maker on Expo

@bomar24

Great Job dude...!

5 months ago

an.nguyenquocduy@gmail.com

@anguyen

it is awesome

5 months ago

ashley beshir Maker on Expo

@ashleybeshir

some of the text gets trunucated on android

7 months ago

rex pen

@rex26

good job!

7 months ago

songdewu

@songdewu

@rex26

4 months ago

Panagis Alisandratos

@palisand

Now that iOS users can't view expo projects they don't own (thanks Apple), how can we load the playground on our devices? Is our only option https://reactnavigation.org/docs/contributing.html#run-the-example-app ?

7 months ago

Brett Higgins

@brettdh

@palisand I've been wondering about this as well. :/

7 months ago

Brent Vatne Maker on Expo

@notbrent

@brettdh - you can still load it in ios simulator, you can copy exp://expo.io/@react-navigation/NavigationPlayground to clipboard and paste it into the dialog when you press + on the projects tab

7 months ago

Seiya Yoshitaka

@yo7

@notbrent + on the projects tab? I don’t see it ಠ_ಠ

7 months ago

Brent Vatne Maker on Expo

@notbrent

@yo7 - but it still exists in the ios simulator. hopefully this screenshot helps: http://url.brentvatne.ca/j7nU4o

7 months ago

Hani Yahya

@haniyahya

@notbrent I don't have that + like you, I'm using version 2.5.0 (latest) -> my screenshot http://prntscr.com/jbue7w

7 months ago

Brent Vatne Maker on Expo

@notbrent

@haniyahya - that is not a simulator. the + is only there in the simulator

7 months ago

Imran Yusof

@suretarget

@notbrent - You saved my day. Thanks for the cool libraries.

7 months ago

Carey Cade Maker on Expo

@careypotpie

@notbrent but how do we get the simulator? Thanks!

6 months ago

Autocode

@autocode

Awesome! :-)

8 months ago

tonyb

@tonyb

Very cool

8 months ago

krishna patel

@krishna812

TypeError : undefined is not an object (evaluating 'this.props.navigation.navigate')Here is my code/* @flow */import React, { Component } from 'react';import {View,Text,StyleSheet,} from 'react-native';import { Container, Header, Content, Button} from 'native-base';import Loginuser from './Loginuser';import {StackNavigator,} from 'react-navigation';const AppNavigator = StackNavigator({Loginuser: {screen: Loginuser},})export default class Login extends Component {render() {const { navigate } = this.props.navigation;return (<Button blockonPress={()=> navigation.navigate("Loginuser")}>Click here for Login/Registers);}}Kindly help me to resolve this issue

8 months ago

joaquin8choa

@joaquin8choa

@krishna812 package.json?

8 months ago

Andersson Velasquez

@andersson

I am using tabNavigator but for some reason when I try to modify the color and add icons, the changes are not shown.

9 months ago

ayyagaries@gmail.com

@ayyagary1

How do I connect the drawer to Redux

9 months ago

hossein babapour

@hossbaba

hi, Can i customize the source and build an App .?

9 months ago

Jimmy Lee

@jimmylee

I'm really excited about what the @react-navigation team is going to do next. @notbrent is a pro.

9 months ago

yongqianvip

@yinyongqian

Really Cool !!

9 months ago

kunyin tang Maker on Expo

@kunyintang

Good job !

9 months ago

Marcelo macCoy

@marcelomaccoy

@kunyintang Really a good job!!!

9 months ago

Eraldo Junior

@jrfx

Guys, the 'Toggle Header' sample isn't there. Can you

10 months ago

Semih VURAL

@semih

Good job guys!

10 months ago

Salil Kaul Maker on Expo

@kaulsalil88

How can i see the source code of the same .

10 months ago

Jiaji He Maker on Expo

@hejiaji

@kaulsalil88 You can simply visit the official github of this project: https://github.com/react-navigation/react-navigation. The source code is under the examples folder.

10 months ago

Jiaji He Maker on Expo

@hejiaji

@kaulsalil88 You can simply visit the official github of this project: https://github.com/react-navigation/react-navigation. The source code is under the examples folder.

10 months ago

Joakim Johansson

@yarism

I also get: This experience uses SDK v17.0.0, but this Expo client requires at least v18.0.0 Please update

11 months ago

React Navigation Creator

@react-navigation

@yarism - fixed!

11 months ago

Joakim Johansson

@yarism

@react-navigation - thanks!

11 months ago

Furkan Vatandaş

@mfv

Can't open

11 months ago

React Navigation Creator

@react-navigation

@mfv - fixed!

11 months ago

didjo972@gmail.com

@didjo972

Running into the error : This experience uses SDK v17.0.0, but this Expo client requires at least v18.0.0 Could you update it ?

11 months ago

React Navigation Creator

@react-navigation

@didjo972 - fixed!

11 months ago

dongsheng guo Maker on Expo

@dongsheng

I am chinese. I learn expo so hard!

11 months ago

React Navigation Creator

@react-navigation

@dongsheng - sorry to hear that!

11 months ago

Lei Jiang Maker on Expo

@jweboy

@react-navigation Are there any plans to arrange Chinese documents?

11 months ago

Crysfel Villa

@crysfel

Can't open this demo on latest expo client (2.2.0.1011491)

11 months ago

React Navigation Creator

@react-navigation

@crysfel - fixed!

11 months ago

alexunder.kovtun@gmail.com

@alexwhile

I want to see the complete code of navigation examples to see why my code does not work. How can i do this?

11 months ago

an.nguyenquocduy@gmail.com

@anguyen

@jimmylee thanks Jimmy

5 months ago

Scan to open

With an Android phone, you can scan this QR code with your Expo mobile app to load this project immediately.

Open project in the browser

Missing Appetize code

If servers are busy, an Appetize code allows you to skip the line.

To buy an Appetize code, visit Appetize.io and enter the code in the field below

Request a link

Enter your e-mail or phone number below and you will get a link to open the project for your mobile device.

Download Expo Client

Use our iOS or Android app to directly view Expo projects on your phone

Get started with Expo

Dive in and create your first Expo project.