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
0
Question by PeteWatch · Aug 15, 2018 at 05:11 PM · transformspritesaspect ratiodynamically

How do I properly position dynamically loaded images and maintain aspect ratio ?

I'm working on a 2D project and I'm having a hard time figuring this out.

Currently I load images through an xml file, all of which are located in the StreamingAssets folder. Images are loaded (with a button click) in an image container.

The images can be landscape, portrait or even square, but I need to have the image always be 700px wide, and aligned to the top of the container (a UI Panel).

If I tick "Preserve Aspect", the images are not stretched, which is good, but instead they are fitted into my container, and this results in portrait images having space left and right, and landscape images having space above and below the image.

I have also tried the Rect Transform align tools, the layout components, the aspect ratio fitter and also the Rect Mask 2D.

Whatever I try, I simply cannot get my image aligned to the top and filled horizontally (700px wide the width of the image container).

If I need to tackle this in code, that's fine, but I have no idea where to start.

Any help is appreciated (...as I've been trying to get this right all day and haven't come up with a solution).

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

1 Reply

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

Answer by FernandoHC · Aug 15, 2018 at 05:34 PM

You want to use the texture width and height and compare with the container size, so you can shift the position relatively.

I have written an example code for you that can do that, it only changes Y for now, but you can change it to whatever you want:

     public Image image;
     public RectTransform rectTransform;
     public float scaleConstant = 1f;
     public void AdjustImage()
     {
         float topDistance = rectTransform.rect.height - image.sprite.texture.height;
         Vector3 position = transform.localPosition;
         position.y = topDistance * scaleConstant;
         transform.localPosition = position;
     }
Comment
Add comment · Show 1 · 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 PeteWatch · Aug 15, 2018 at 06:33 PM 0
Share

Fernando, thanks so much for this. This helped tremendously and I wouldn't have found this solution by myself.

I am now succesfully moving the images along the y axis !

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

118 People are following this question.

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

Related Questions

Custom Editor: InspectorGUI showing sprite variables,Lists,transform variables,... 0 Answers

Sprite moving too far/fast 1 Answer

How to dynamically set transform positions (for a Bezier curve)? 2 Answers

how to make a sprite face your character on one axis? 0 Answers

How to draw a Sprite next to theplayer 0 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