Roku Developer Program

Join our online forum to talk to Roku developers and fellow channel creators. Ask questions, share tips with the community, and find helpful resources.
cancel
Showing results for 
Show  only  | Search instead for 
Did you mean: 
jseigle85
Visitor

creating custom video player

I am having a hard time creating a custom application. I did not understand how to program the application and the third-party developers can not help me. So here is my problem.

I am using the customvideoplayer.zip application it work ok for me but I would like some changes made. Currently if you just click on the customvideoplayer icon form the roku menu you will get a screen with a background image a display of the content on the left and instructions on the right overlaying a background image. If you press the down key the display will show your content in full screen.

The change I would like to make is after select the customvideoplayer icon from the Roku menu I would like for it to Display the content in fullscreen mode automatically without press the down arrow.

Can someone please provide me with the code that will be inserted in the main.brs file.
0 Kudos
10 REPLIES 10
renojim
Community Streaming Expert

Re: creating custom video player

Change this:
    this = {
port: CreateObject("roMessagePort")
progress: 0 'buffering progress
position: 0 'playback position (in seconds)
paused: false 'is the video currently paused?
fonts: CreateObject("roFontRegistry") 'global font registry
canvas: CreateObject("roImageCanvas") 'user interface
player: CreateObject("roVideoPlayer")
setup: SetupFramedCanvas
paint: PaintFramedCanvas
eventloop: EventLoop
}
to this:
    this = {
port: CreateObject("roMessagePort")
progress: 0 'buffering progress
position: 0 'playback position (in seconds)
paused: false 'is the video currently paused?
fonts: CreateObject("roFontRegistry") 'global font registry
canvas: CreateObject("roImageCanvas") 'user interface
player: CreateObject("roVideoPlayer")
setup: SetupFullscreenCanvas ' THIS LINE CHANGES
paint: PaintFullscreenCanvas ' AND THIS LINE
eventloop: EventLoop
}

If you don't want the Down key to go back to the framed video, remove these lines completely:
                else if index = 3 '<DOWN> (toggle fullscreen)
if m.paint = PaintFullscreenCanvas
m.setup = SetupFramedCanvas
m.paint = PaintFramedCanvas
rect = m.layout.left
else
m.setup = SetupFullscreenCanvas
m.paint = PaintFullscreenCanvas
rect = { x:0, y:0, w:0, h:0 } 'fullscreen
m.player.SetDestinationRect(0, 0, 0, 0) 'fullscreen
end if
m.setup()
m.player.SetDestinationRect(rect)

I should note that I haven't actually tried these changes, but they should work.

-JT
Roku Community Streaming Expert

Help others find this answer and click "Accept as Solution."
If you appreciate my answer, maybe give me a Kudo.

I am not a Roku employee.
0 Kudos
jseigle85
Visitor

Re: creating custom video player

The code you gave me to edit made the screen go into fullscreen but the content still play in the small displayed frame. If I press the down key it exit full screen mode then if I press the down key again it go back to fullscreen mode, but the content also go into fullscreen.

this = {
port: CreateObject("roMessagePort")
progress: 0 'buffering progress
position: 0 'playback position (in seconds)
paused: false 'is the video currently paused?
fonts: CreateObject("roFontRegistry") 'global font registry
canvas: CreateObject("roImageCanvas") 'user interface
player: CreateObject("roVideoPlayer")
setup: SetupFullscreenCanvas ' THIS LINE CHANGES
paint: PaintFullscreenCanvas ' AND THIS LINE
eventloop: EventLoop
}

picture this. you see a black screen with a loading % in the middle as it is in fullscreen mode and when it reach 100% the screen stay black but the content play in the small frame in the same location as the orginal customvideoplay. When you press the down key it exit fullscreen mode still showing the content in the small frame but when you press the down key again the screen and content that was in the frame go to fullscreen.

What do we need to do with the code the make the content play in fullscreen mode. This code seems to be close, but messing one part
0 Kudos
renojim
Community Streaming Expert

Re: creating custom video player

Ok, I should have tried it before I posted. Change the line:
    this.player.SetDestinationRect(this.layout.left)
to:
    this.player.SetDestinationRect(this.layout.full)

I can't say for sure other changes won't be necessary, but it will play the video full screen.

-JT
Roku Community Streaming Expert

Help others find this answer and click "Accept as Solution."
If you appreciate my answer, maybe give me a Kudo.

I am not a Roku employee.
0 Kudos
jseigle85
Visitor

Re: creating custom video player

Thank you, this works great. I would like to ask one more question.

Other than the SDK is there a book manual that have all of the coding commands for creating applications? The SDK explain only a few things and it does not give you examples, so I would like to find a manual that has all of the coding so I can create application.

Example I would have never know how to make the changes you did to get what I wanted inless there was a manual to tell me how to.
0 Kudos
kbenson
Visitor

Re: creating custom video player

"jseigle85" wrote:
Thank you, this works great. I would like to ask one more question.

Other than the SDK is there a book manual that have all of the coding commands for creating applications? The SDK explain only a few things and it does not give you examples, so I would like to find a manual that has all of the coding so I can create application.

Example I would have never know how to make the changes you did to get what I wanted inless there was a manual to tell me how to.


Not currently. There are quite a few examples though, you are using one as the base for your new channel in fact. The BrightScript reference manual and Component reference included in the SDK do cover in detail almost all aspects of the language itself. Reading them in full is recommended.

I agree that jumping into development could be frustrating, specifically because it's a new/proprietary language. It helps to have prior programming experience, no matter the level, so the best help for someone a little shaky on the core concepts might be to just learn some of the basics through a class, book, or website for some other language. I think Javascript has a lot of parallels (VBScript may be better, but I have no reference point to work from there, not do I know how available recent learning material is).
-- GandK Labs
Check out Reversi! in the channel store!
0 Kudos
jseigle85
Visitor

Re: creating custom video player

Would you be willing to share you knondage with the basic how to code as my team create software for your company which will allow others to create applications faster and easy.
0 Kudos
kbenson
Visitor

Re: creating custom video player

"jseigle85" wrote:
Would you be willing to share you knondage with the basic how to code as my team create software for your company which will allow others to create applications faster and easy.


Neither renojim nor myself work for Roku, so I assume you are addressing this towards Roku directly. If so, I'm sure they would love to hear about specific shortcomings in dealing with the SDK so they can improve it, but without a specific example it would be hard for them to know where to improve (unless they've already assessed that area as lacking).
-- GandK Labs
Check out Reversi! in the channel store!
0 Kudos
renojim
Community Streaming Expert

Re: creating custom video player

"jseigle85" wrote:
Example I would have never know how to make the changes you did to get what I wanted inless there was a manual to tell me how to.

The changes were pretty obvious to me, but that's because I've been working with the SDK for quite a while now so I know how everything works and I have some familiarity with the examples. I noticed the dual setup and paint functions, so it didn't take much to figure out that they had to be swapped to start fullscreen rather than framed. When you mentioned it still started with the video in a small frame I realized there must be a TargetRect parameter someplace that needed to be changed.

I had almost no experience with VB script or JS when I started, but lots of programming experience in general. You should be able to pick up a lot by going through some of the examples. Anything that starts with "ro" and any CreateObject references you should be able to look up in the Component Reference or BrightScript Reference. Don't be afraid to make changes to the examples to see what happens.

There are lots of people here that will give you some help if you get stuck. Good luck!

-JT
Roku Community Streaming Expert

Help others find this answer and click "Accept as Solution."
If you appreciate my answer, maybe give me a Kudo.

I am not a Roku employee.
0 Kudos
jseigle85
Visitor

Re: creating custom video player

I would like to add something to the code that you help me change. I would like to add a button at the upper left coiner of the screen. I would like this button to open up another application. The application would be a slideshow image. I need this so I can create a tv guide.

Can you tell me what I need to add to the code you help me with earlier to create a button in the upper left side of the screen. to open new application flickr
0 Kudos