Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Basic <Video> tag implementation #466

wants to merge 3 commits into from


Copy link

brentvatne commented Mar 30, 2015

Put this together together today with the help of @tadeuzagallo, far from complete but you can see it in action in my react-native-login repo.

Special props beyond the standard RCTView:

  • resizeMode with the same options as Image
  • source which just accepts a string currently, which is then used to locate the resource locally.

demo gif

Some remaining tasks:

  • Support require('video!...')
    • Support other extensions than just mp4?
  • Add prop to set repeat (none or forever)
  • Restart video when view becomes active again?
  • Decide how far to go with this PR - many more properties and options we could potentially implement
Brent Vatne

@implementation VideoContentModes

- (NSDictionary *)constantsToExport

This comment has been minimized.

Copy link

tadeuzagallo Mar 30, 2015


No need for this extra module, you can move it into RCTVideoManager.m

Brent Vatne added 2 commits Mar 30, 2015
Copy link

joshhornby commented Mar 30, 2015

Really like the look of this 👍

Copy link

grp commented Mar 30, 2015

Hey, this looks great but in the past I've noticed a few issues with MPMoviePlayerController — it often blocks the main thread (causing stutters) whenever you create one, and you can only have one of them on the screen at a time. Using AVPlayer directly can avoid that, although it's more complex to use.

Internally, we have a wrapper around AVPlayer with a nice API. I'll see about open sourcing that: it might make a good core for a <Video> component.

Copy link
Collaborator Author

brentvatne commented Mar 30, 2015

@grp - that would be great! Looking forward to seeing it

Copy link

vjeux commented Mar 30, 2015

Actually, I think this would be better for you to create a separate github repo for this specific component, iterate on it and when it reaches maturity we can see about including it in the main repo. Otherwise we're going to slow you down as we're not going to include something half baked as part of the core build.

Copy link
Collaborator Author

brentvatne commented Mar 30, 2015

@vjeux - that makes total sense, agreed

@brentvatne brentvatne closed this Mar 30, 2015
Copy link
Collaborator Author

brentvatne commented Mar 31, 2015

facebook-github-bot added a commit that referenced this pull request Mar 9, 2017
We need to take the margin into account if we clip on max dimension. Fixes #466.
Closes facebook/yoga#467

Differential Revision: D4681342

Pulled By: emilsjolander

fbshipit-source-id: 56311df9864a284d553c31f1c6db382f337f1fad
jfrolich pushed a commit to jfrolich/react-native that referenced this pull request Apr 22, 2020
ayushjainrksh pushed a commit to MLH-Fellowship/react-native that referenced this pull request Jul 2, 2020
… for each version of React Native. As a result, people can go back and see what a View component looked like in any past React Native release. (facebook#466)

This is less relevant for "evergreen" content such as the Getting Started
guide, the Tutorial, and basically the rest of the Guides. These docs should
be getting updated across all versions at the same time. This script makes
sure we are not tracking separate versions of a unversioned doc.

We achieve this by ensuring any changes made to these files in `docs/` are
then persisted to the `versioned_docs/version-0.5` folder, as Version 0.5
is the oldest document version. This makes it so that the same text is
displayed to the reader, regardless of what version they are looking at.

This script is not yet invoked in CI or as a pre-commit hook, but the plan is
to enable it soon.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet
Linked issues

Successfully merging this pull request may close these issues.

None yet

5 participants
You can’t perform that action at this time.