Wayback Machinekoobas.hobune.stream
May JUN Jul
Previous capture 12 Next capture
2021 2022 2023
1 capture
12 Jun 22 - 12 Jun 22
sparklines
Close Help
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
  • Asset Store
  • Get Unity

UNITY ACCOUNT

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account
  • Blog
  • Forums
  • Answers
  • Evangelists
  • User Groups
  • Beta Program
  • Advisory Panel

Navigation

  • Home
  • Products
  • Solutions
  • Made with Unity
  • Learning
  • Support & Services
  • Community
    • Blog
    • Forums
    • Answers
    • Evangelists
    • User Groups
    • Beta Program
    • Advisory Panel

Unity account

You need a Unity Account to shop in the Online and Asset Stores, participate in the Unity Community and manage your license portfolio. Login Create account

Language

  • Chinese
  • Spanish
  • Japanese
  • Korean
  • Portuguese
  • Ask a question
  • Spaces
    • Default
    • Help Room
    • META
    • Moderators
    • Topics
    • Questions
    • Users
    • Badges
  • Home /
avatar image
1
Question by Dvionst · Apr 03, 2016 at 04:08 AM · uiscreenanchoraspect ratio

UI different between 16:10 and 3:2 (portrait) how can i fix?

Hi guys, this is my first question. im new to unity and im struggling in this problem.

i made a picture for all of the detail.

alt text why this UI are not following the camera size? i set the anchor or maybe im wrong? is script needed for this? thx for your help. :)

1.png (204.9 kB)
Comment
Add comment
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users

3 Replies

· Add your reply
  • Sort: 
avatar image
1
Best Answer

Answer by fugogugo · Apr 03, 2016 at 10:12 PM

In the CanvasScaler, do you see the Match value?

simply move the slider to the far right (height) so the canvas scaling will follow the maximum height. that means that when the screen aspect ratio changed, the width will be the one changed.

Comment
Add comment · Show 5 · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image Bleackk · Apr 03, 2016 at 10:47 PM 0
Share

That doesn't fix all of his problems. What if he has objects to the left and right? Just moving the slider to the middle wont do the trick itself.

avatar image Dvionst · Apr 04, 2016 at 04:07 AM 0
Share

nice, this objects position are matching the height.. but i set it to width :p thats my mistake thankyou.

avatar image Dvionst · Apr 04, 2016 at 04:10 AM 0
Share

but now its not following the width :p.. ill try using a script

avatar image fugogugo · Apr 04, 2016 at 10:38 AM 0
Share

well usually you need to choose between following width or height if you wanna keep a good aspect ratio of your game

if you need to stretch both width and height then simply change screen match mode to Expand or shrink, which I don't really recommend

avatar image fugogugo · Apr 04, 2016 at 10:40 AM 0
Share

if you want the object to stick on the edge , simply change the object anchor to left or right. no matter how wide the width stretched, the object will stick to the edge

avatar image
1

Answer by Bleackk · Apr 03, 2016 at 10:11 PM

  1. Select your Canvas

  2. Change Render Mode to Screen Space - Overlay

  3. Canvas Scaler Match to Width and change your reference resolution to your needs

  4. Set the pivot points for your UI objects (most effective way is to set the pivot point RIGHT Above or Next or Below the object, for example your hearts are high on the screen then set the pivot points above them )

With that your objects will stay on screen, BUT it wont fix the problem of the location the location is set to the aspect ratio. You will have to Move the objects around but it will fix the "Out of screen" Issue

Comment
Add comment · Show 2 · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users
avatar image Dvionst · Apr 04, 2016 at 04:06 AM 0
Share

your solution is good :) thankyou but @fugoguo solution fix the main problem..but thx anyway

avatar image Bleackk Dvionst · Apr 04, 2016 at 02:12 PM 0
Share

At your serive :D. Glad i could be of help :)

avatar image
1

Answer by guywald · Apr 03, 2016 at 01:51 PM

I've had a similar issue. My solution was to create an empty gameobject wrapper containing the object's graphic. The container's anchors would be set to divide the screen correctly and the child graphic object would have an Aspect Ratio Fitter componenet

In your case, for example, set three game objects (life wrapper, score wrapper, pause button wrapper) holding the score, life and pause button as a child. Set the anchors of the wrapping container to be the percentage you want, set the offsets to have zero distance from the anchors (positions of zero).

Add the graphic to each container and add an Aspect Ratio Fitter component (In layouts) to each of the graphics (not the container but it's sub graphic game object). Set the Aspect Mode to 'Fit in parent' and try different values for the aspect value. The 'Fit in parent' will have the the shape fit in the container. Setting a value of 1 will have the object scale evenly to both directions as the screen's resolution change.

Reference: http://docs.unity3d.com/Manual/script-AspectRatioFitter.html

Another tool which helped me is the Content Size Fitter (http://docs.unity3d.com/Manual/script-ContentSizeFitter.html).

Comment
Add comment · Share
10 |3000 characters needed characters left characters exceeded
▼
  • Viewable by all users
  • Viewable by moderators
  • Viewable by moderators and the original poster
  • Advanced visibility
Viewable by all users

Your answer

Hint: You can notify a user about this post by typing @username

Up to 2 attachments (including images) can be used with a maximum of 524.3 kB each and 1.0 MB total.

Follow this Question

Answers Answers and Comments

6 People are following this question.

avatar image avatar image avatar image avatar image avatar image avatar image

Related Questions

Anchor doesn't affect objects inside of another object 0 Answers

Unity Canvas Anchor Can't See 1 Answer

Anchor UI elements to the root canvas 0 Answers

Questions about UGUI Rect Transform Anchors. How to make UI objects scale, correctly, with screen? 1 Answer

Help resizing UI at runtime 2 Answers


Enterprise
Social Q&A

Social
Subscribe on YouTube social-youtube Follow on LinkedIn social-linkedin Follow on Twitter social-twitter Follow on Facebook social-facebook Follow on Instagram social-instagram

Footer

  • Purchase
    • Products
    • Subscription
    • Asset Store
    • Unity Gear
    • Resellers
  • Education
    • Students
    • Educators
    • Certification
    • Learn
    • Center of Excellence
  • Download
    • Unity
    • Beta Program
  • Unity Labs
    • Labs
    • Publications
  • Resources
    • Learn platform
    • Community
    • Documentation
    • Unity QA
    • FAQ
    • Services Status
    • Connect
  • About Unity
    • About Us
    • Blog
    • Events
    • Careers
    • Contact
    • Press
    • Partners
    • Affiliates
    • Security
Copyright © 2020 Unity Technologies
  • Legal
  • Privacy Policy
  • Cookies
  • Do Not Sell My Personal Information
  • Cookies Settings
"Unity", Unity logos, and other Unity trademarks are trademarks or registered trademarks of Unity Technologies or its affiliates in the U.S. and elsewhere (more info here). Other names or brands are trademarks of their respective owners.
  • Anonymous
  • Sign in
  • Create
  • Ask a question
  • Spaces
  • Default
  • Help Room
  • META
  • Moderators
  • Explore
  • Topics
  • Questions
  • Users
  • Badges