Broadway
Broadway copied to clipboard
How to prevent canvas size from resizing itself every frame?
It seems that onpicturedecoded resizes the canvas to the incoming video width/height. Is there a way to force the video to stay a certain size? For example, if I have a container div that's 200x200px and the video coming in is larger, the canvas currently just bloats out of the container and covers other things.
you will have to change the broadway code that resizes the stream. can you somehow determine what size your stream will be before? then you can create a variable with the desired size and instead of the current resize you resize to your desired size
You can also just set the css width
/ height
properties on the canvas element. I forget if the code overwrites these properties, but you can always force them with important!
.
@mbebenita im pretty sure it wont work with css but a fixed size might be a good addition to the project. if only i had time to do it ;)
Having a fixed size is generally difficult to do, because the aspect ratio can change. Something like this probably needs to be implemented - http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/display/StageScaleMode.html
i was more thinking about something simple like fix width and height and prevent player from changing the size. that would be straight forward. there is one complication thou and that is the actual size of the video stream instead of the output plane size. the width of the output plane will allways be devidable by 16. thats why on some videos you will see a green border.
Here's a pr to handle canvas sizing. https://github.com/mbebenita/Broadway/pull/184
@OllieJones sorry ollie that pr is unacceptable. please make a new one!
i was more thinking about something simple like fix width and height and prevent player from changing the size. that would be straight forward. there is one complication thou and that is the actual size of the video stream instead of the output plane size. the width of the output plane will allways be devidable by 16. thats why on some videos you will see a green border.
@soliton4 I need to remove a green border in the video image. Please let me know how to remove a green border or to change it to another color (for example, black color).
you need to know about the real video size, then put the canvas inside a div and resize the div to the real video size
@soliton4 Thanks for your reply. I'm using the real video size in my project, but when resizing my application, I can see a green border in a very short time. Can we change a green color to another color in this project?
@soliton4 Could you let me know how to change a green color in this project? If you let me know how to do it, I'll do it.
pls post a screenshot
@soliton4 I post a screenshot.