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 /
  • Help Room /
avatar image
0
Question by siryami · Nov 19, 2015 at 02:33 AM · uibuttoncanvasui image

Manipulate ui canvas button hitbox

This should be simple but can't find it anywhere. I made a UI button and made the source image my own image. I set it to native size and it looks good but..

alt text

there seems to be some buffer in between my image and the border that I can't get rid of. I would want the border to hug the edges, or else the user can press the button without touching it. Any ideas?

untitled-1.png (11.0 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

2 Replies

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

Answer by united4life · Nov 19, 2015 at 05:20 AM

Hi,

Make sure your button image is not like this. alt text

In the canvas it will look like this.

alt text

So make sure your button image size is cropped till the border of the image. There should not be any transparency.


1.jpg (26.4 kB)
2.jpg (25.1 kB)
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 siryami · Nov 19, 2015 at 05:47 AM 0
Share

Dammit, was sure I had cropped it. Thanks

avatar image
1

Answer by ian_sorbello · Nov 19, 2015 at 04:40 AM

Working with the UI can be fun AND frustrating :) It will take practice.

But anyway, here is a way to achieve this:

  • In the RectTransform, choose the Anchor Preset for Stretch X&Y (it's the icon in the lower right corner when you open the Anchor Preset flyout (also the Anchor Preset is the button that has "stretch" and "stretch" next to it

  • Then (and this is important) - edit LEFT, TOP, RIGHT and BOTTOM values, make them all 0 (this will fill out the image to the full size)

Comment
Add comment · Show 3 · 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 siryami · Nov 19, 2015 at 04:59 AM 0
Share

Thanks for response, but this isn't what I want. I would like the border of the button to actually touch its image, with no empty space between. I tried what you said and it just makes the image take the size of the whole screen (with the space still present).

avatar image ian_sorbello · Nov 19, 2015 at 05:03 AM 0
Share

O$$anonymous$$ - You may need to show more detail on the hierarchy and the values set. Other ways to constrain an image is to make the image a child object of the button.

So you have a clear size and position for the button. $$anonymous$$ake a new sub object and add the Image component there. Then do as above and it will fill to the size of it's parent (not the whole screen).

avatar image siryami · Nov 19, 2015 at 05:46 AM 0
Share

Ok, now it works and fills up to size of the button. But space is still there and its my fault because of a faulty asset I thought i had cropped. Still, +1 for showing me the strech xy.

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

42 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

Related Questions

Problem with creating button via script. 1 Answer

How can I change the UI button color when clicked 1 Answer

Scaling an image sent to UI Image 0 Answers

Share button AR 0 Answers

Button becomes unclickable if it is in the panel 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