VideoDisplay and black on top and bottom - actionscript-3

i'm using videodisplay to play a rtmp stream, streamed video is 800X600 which also the size of the videodisplay.
but when it starts to play a black area appears on both top and bottom of the video.
attached image shows what i mean

Depends on the ratio of video, but I think you can use something like this:
videoDisplay.scaleMode = ScaleMode.STRETCH;
or
videoDisplay.scaleMode = ScaleMode.LETTERBOX;
Update :
So in this case I think setting maintainAspectRatio as false within your <mx:videoDisplay /> will help you, Although the main purpose of that is maintaining the original aspect ratio while resizing the video.

Related

How to resize image so that it is not blurred or pixelatted

So I just created a blog on Blogspot. And I'm currently using a simple free blog template from the internet.
You can refer my blog here - https://hariinisayarasa.blogspot.com
Im using the free template from here - https://www.way2themes.com/2020/08/sylva-blogger-template.html
As you can see, you can compare the slider image on my blog is blurry and pixelated compared to the one on the Demo Page here - https://sylva-way2themes.blogspot.com/
Is there any way I can resize my image or any setting that can be done in my template coding so that the slider images are not blurry anymore?
Please let me know if I can provide any code for you so that you can help me solve this problem.
Or you can download the code here - https://www.way2themes.com/2020/08/sylva-blogger-template.html
One of the simplest ways to resize an image in the HTML is using the height and width attributes on the img tag. These values specify the height and width of the image element.
Resizing img with HTML
<img src="https://ik.imagekit.io/ikmedia/women-dress-2.jpg"
width="400"
height="500" />
Resizing img with CSS
img { width: 400px, height: 300px}
From what I've seen, you're using very small raster images.
notice the 'intrinsic size' property
same goes here
Photographs are always saved as raster images. It means that the data of an image is stored in the form of a pixel map - a matrix of squares. If you try to scale the image up, every pixel is also scaled up. Therefore, you lose quality, and the pictures seem pixelated/blurry.
There's no way to keep both the size and detail. Alternatively, you could try to keep the initial size of an image (or at least scale down) - this would, on the other hand, not fill the entire container space.
now check the intrinsic size of one of the images on the demo page
The more scaled image is, the more blurry it gets. The pictures on the demo page have the scale aspect of 2. However, your photo that is 72 x 72px has been scaled up a lot more.
If those photos have been taken by you in higher quality, you might want to use the raw version.

Full screen in embedded videos from Youtube

I want to see a screen full of embedded video but i am getting black borders on left and right but i have included allow full screen in my coding also.How to remove the borders and see stretched video? I am attaching my code and screen shot .!Screen shot of the borders<iframe id="vid" width="100%" height="100%" src="https://www.youtube.com/embed/RdIh8GiVR9I?autoplay=1&modestbranding=0&controls=0&showinfo=0&rel=0&allowfullscreen=true"></iframe></div>
The answer to this is slightly more complicated.
The "allowfullscreen" is just there for displaying the "fullscreen" button. (Although it's kind of strange)
To make it behave like you want to, have a look at this explanation
(The section with "<iframe>")
Basically, you need to put the video in a div with the full width of the website (what you probably already did) and some css magic to make it the correct height.

How to make flash animation responsive

i'm starting to build this bootstrap site where I have flash animation on my fontpage. --> http://testi9.aada.fi/index.php?cID=180
My animation size is 1472px x 485px. Now I want it to be 100% width on bootstrap site so that it would strech nicely on different screen sizes.
I added this css code on bootstrap css file:
#swfcontent169 {
border:solid thin #f00;
width:100%;
}
Now my flash animation is 100% but somehow those "symbols" that are
on my flash animation on each side are visible too and animation is not stretched as i would like it to be (full width).
Can someone help me out with this?
// Mika
You need to set the proper scaling mode for the flash object. (the scale embed property) or stage.scaleMode through AS3 code.
Here is a visual rundown of the options: (you will likely want exact fit or no border)
Let's say this is your document:
We have four boxes (one per corner), and some gray boxes that are off the stage.
Here are you options:
Show All:
Show all scales the content so the whole stage fits, but then you get a gutter if it's not the right size and objects off stage may be visible.
No Border:
This will scale it so the whole content will fill the bounds (keeping aspect), but then if it's not the exact size, you'll get cropping of the stage, see how the boxes are being cropped on the top bottom? You can change the way it aligns the cropped stage with the stageAlign property.
Exact Fit
This will just make the whole stage fit in the area defined, but it will not honor your aspect ratio and things could looked squished/stretched.
No Scale
This won't scale the stage AT ALL. So if the defined area is smaller than the stage, it will crop it, if larger, you'll get gutters.
You probably want exact fit or no border - depending on if you need the aspect ratio to be fixed. You can also use no-scale and use code to align your contents the way you want.
You can align the content several ways too using the align embed parameter.
You can adjust these in your embed code. There are also options in the FlashPro publish settings (when you click on the HTML Wrapper Format), or you can use an online tool like: http://embed-swf.org/embed-swf.php

Libgdx How to focus camera only on part of the actual screen?

So am working with making my game work on all resolutions, and I have made it that 16:9 aspect ratio is turned to 5:3 as my game logic is made in 5:3 dimensions but when the screen is 16:9 I have to cut off some of the top. In simple terms I have a 1280x768 screen trying to fit into a 1280x720 space. All it does now is squeeze the image height to fit into the 720 piece.
What I do now is set the camera to 1280x768 then tried to use a viewport set to 1280x720 but no change was seen. Basically how do I effectively cut some part of the screen off?
Most of the time we set the position of the camera as the center of the screen,but you can alter it with camera.position.set(x,y,z).If you wish to cut some portion,then just set the position of the camera accordingly.In addition to this,You can use the functions like camera.translate(x,y,z) through which you can translate the position of your camera. You can also use the camera.zoom to add some zooming effect into it. Don't forget to add camera.update() after doing any of the operations on your camera.

problem embedding flash in webpage

I am not sure whats going wrong but when I am using a flash file in the web page when I am setting size
style="width: 445px; height: 386px"
white strips are embedding sideways automaticaaly,,
while using the same page with size
width="450" height="440"
no white strips appear.
It might be the problem associated with the aspect ratio.
Is there any way to set these white strps to transparent????
or to remove these strips?????
Can we see a link? Or some code? It appears to be an aspect ratio problem because the width and height are definitely a different aspect ratio in your second scenario. Or if the white strips are the flash stage, you can also set wmode to transparent, and the html background will show through.