simple responsive project doesn't fill browser viewport

[slog70]

hello all,

I just created a simple project from scratch using all settings as default: 

- canvas is 1920x1080

- I created a simple rectangle that is 1920x1080px.

I published the file so that it should be reactive (make reactive: both).

The result is reactive but it doesn't fill my browser viewport. 

It's a bit smaller in width (see attachment)

Why?

It should fill the browser windows here (my monitor resolution is 1920x1080px).

Perhaps I am missing something?

TIA for any help.

Tony

[JoãoCésar]

Hi.

What Animate CC does is to scale up or down the default canvas and stage according to the browser inner size and the device pixel density.

But this is scaling is similar to the one we see applied to videos. Which means that your content will hardly fit without borders to the users browser.

If you want a really responsive UI, you're gonna have to disable all scaling options in the Publish Settings and write a true responsive code yourself. Meaning that you need your UI elements to keep the same size in any device screen but with different individual positions.

Regards,

JC

[slog70]

Thanks JC,

I don't need the animation to fit the viewport by widht __and__ height.

I need it to fit by width and get the height proportionally. 

The same as a responsive image would fit in the browser window.

I tried all combinations in the publication settings, but without luck.

Tony

[slog70]

just to let you know: using Animate CC 2015.2 seems to work correctly.

[JoãoCésar]

Hi. Have you tried Scale to fill visible area: Strectch to fit?

[slog70]

yes, I tryed all combinations. Only Animate CC 2015 works. :(.

[JoãoCésar]

Do you mind sharing your FLA? Even if you have to use placeholder assets. Because it's working for me and I'm using the latest release of Animate CC.

[slog70]

Hi JoãoCésar,

you can download my sample assets here: https://we.tl/t-udhFmqVJ7V

TIA

tony

browser maximized:

browser half height (about):

Please note that the animation try to fit vertically. This should not happen, when you publish and set "make responsive: by width" only.

Stretching the browser window vertically make scroll bars to appear. But only vertical scrollbars should appear. Horizontal scroll bars should not be displayed because the content should fit.

Here you can see how Animate should work (I have done the animation on the home page using Animate cc 2015.2): https://www.nespoligroup.de/

Please note I had to tweak the code by hand to make this work. 

But I think Adobe should revisit the engine code a bit, to make Animate work for production.

It seems a beta to me.

TIA again.

tony

[JoãoCésar]

Thanks for all the info and file.

I used this settings and it worked.

What happens if you create a new file using the latest version of Animate and then copy the content from your old FLA to this new FLA?