FATAL ERROR :!: Problem with text field

[rostlerkk]

Hello,

have someone solution to fix my issue ? if i create for example rectangle with width 300 px, and too text field with width 300 px, is not the same !!!



And than, if i set for text field top/bottom padding, it works correct. But if i set left/right padding, text field is bigger on right side !?!?



It is not problem with skin, because i create new blank skin. It is not problem with project file, because a i test it with a new blank file. So, where is problem ????

Can someone help me ?

[Tony]

Hi,

I'm not sure what OS and version of Pano2VR you are using but I just did a test on my iMac using Pano2VR Version 6 beta 2 and both the rectangle and text field match.

Here's the process I followed.

1. Created a new project
2. Create a new skin
3. Add a rectangle 300 x 300 px. Set border to 0
4. Add a text field 300 x 300 px. Disable background, set border to 0
5. Paste Lorem Ipsum text to text field. Set Align to Justify, check Word wrap




6. Position text field over rectangle and the text matches exactly




7. Output to test

https://s3-ap-southeast-2.amazonaws.com ... index.html

You can download the skin at https://s3-ap-southeast-2.amazonaws.com ... ample.ggsk

Let me know how you get on,

Tony

[rostlerkk]

Hi,

I try it, but now didn't work "wrap text" .. i think i have something with my software or OS ( Windows 10, Pano 2 VR 6 - last version). I'm not new in Pano, and this look at software problem.

If i add new text block with size 300x300px,border 0, and if i have white background and if i set top/bottom and left/right margin for example 20 px, text field must have 300x300 px and text only 260x260 px !! Or not ???
I will reinstall my computer and then i give you answer if it helps thanks for you time.

[Tony]

Hi,

Okay tried the same process as you did.

1. New Text block 300x390 (made it a bit longer to accommodate the text)
2. Text block has a white background
3. Then set the margins to 20px
4. Checked it in the preview window and this is what it looked like;



Here's an updated panorama with both objects in the skin

https://s3-ap-southeast-2.amazonaws.com ... index.html

Interesting that the actual output is different from the preview window view in that there is more white space at the bottom.

Tony

[rostlerkk]

Hi Tony,

here is my project : http://test.zone360.sk/

as you can see, text block is bigger than restangle, but both have the same width = 300 px !!!

pict of skin preview :

pct of skin editor :

[Tony]

Hi,

Ahh, now I see the issue you are having.

So apparently, and I wasn't aware of this, if you define a text object and set a size of 300px wide and then apply a margin of 20px the text area remains at the original defined size and the background is enlarged to include the margin sizes.

The good news is that you can get around this by adding some inline css styling to the text as shown in this example.




So what I've done her is add the following tag before the text <p style="color:blue;margin: 20px 20px 20px 20px;"> and at the end of the text I've added the tag </p> When I look at it in the preview this is what I see;



Here the whole text object stays at the original size 300px and the text has 20px margins all around it. The output looks like this...

https://s3-ap-southeast-2.amazonaws.com ... index.html

cheers,

Tony

[rostlerkk]

Hi Tony,

inline css works for me perfectly !!! Now i have last questions, how can i disable scalling text ? example : if I explore virtual tour on mobile - portrait orientation, text looks ok. But if I turn mobile on landscape resolution, text is bigger. Can you help me too with this last issue ? thanks for your time man

[Tony]

Hi,

inline css works for me perfectly !!!

That's great news.

But if I turn mobile on landscape resolution, text is bigger.

Once again there is probably more than one way of doing these but the one I've just tested uses a Logic Block to modify the Text box for both Size and Position.



Both Logic Blocks use the same Triggers, isMobile (to check we are on a mobile device) and Player Aspect Ration > 1 (to check for the orientation of landscape)

Here are some images from my Samsung S8, Portrait and Landscape.






You can test the output on your mobile phone at https://s3-ap-southeast-2.amazonaws.com ... index.html

cheers,

Tony

[rostlerkk]

Hi Tony,

I say about font size. Text block works fine, but if i change orientation of mobile, font size is bigger on landscape as on portrait. Is your solution good for font size issue ? I think that your solution is usable only for text field

Steve

[Tony]

Hi, Are you talking about the font size of the text in the Text Block or some other text. When I view this on my mobile the font is the same size!

Do you have an example of what you are seeing?

Tony

[rostlerkk]

Hi Tony,

here is a link of my project : http://aplend.zone360.sk/

and as you can see if you click on some of bottom menu (is in Slovak language), with this text i have a problem.

[Tony]

Hi Steve,

Looks great on the Samsung S8. Great tour can’t see any issues with it everything looks and fits well in both orientations, good job.

Tony