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 siddharth3322 · May 06, 2016 at 09:21 AM · uibuttonunity5eventsystemfocus

UI Element Got & Lost Focus Handling

I am working on desktop game so that want to move focus using arrow keys. Default initial button focus, I have already setup. As well by pressing arrow keys controls is also moving from one button to other but I want to set up scale up and down animation.

When button got focus, I want to do scale up for that button. When button lost focus, I want to do normal scale for that button. <-- I want to implement this thing.

I found this way but this don't contains scale up and down feature. This contains sprite change functionality. alt text

For UI setup, I have used new Unity UI, so my all UI controls belongs to that.

screen-shot-2016-05-06-at-41455-pm.png (27.6 kB)
Comment
Add comment · Show 5
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 meat5000 ♦ · May 06, 2016 at 10:39 AM 0
Share

There is no question here.

Edit your post to fill out more information including what you have tried so far.

avatar image siddharth3322 meat5000 ♦ · May 06, 2016 at 10:44 AM 0
Share

@meat5000, what I need to do that I don't know!! So that I asked here. I thought Unity has definitely some mechanism exist for this stuff that I don't know.

avatar image meat5000 ♦ siddharth3322 · May 06, 2016 at 11:40 AM 0
Share

Well, by 'focus' do you mean

Highlighted

or

Selected

Look at the selectable class, perhaps, and just place your scaling code within the OnSelect callback or just use the isHighlighted flag.

http://docs.unity3d.com/ScriptReference/UI.Selectable.OnSelect.html

http://docs.unity3d.com/ScriptReference/UI.Selectable.OnDeselect.html

Show more comments

2 Replies

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

Answer by meat5000 · May 06, 2016 at 12:20 PM

This is actually very easy. Just put this on each Selectable Object you wish to scale on Select.

 using UnityEngine;
 using System.Collections;
 using UnityEngine.UI;
 using UnityEngine.EventSystems;
 
 public class ScaleButton : MonoBehaviour, ISelectHandler, IDeselectHandler{
 
     Vector2 offMax;
     Vector2 offMin;
     RectTransform myRT;
     void Start ()
     {
         myRT = transform as RectTransform;
         offMax = myRT.offsetMax;
         offMin = myRT.offsetMin;
     }
 
     public void OnSelect(BaseEventData data)
     {
         myRT.offsetMax = offMax * 1.1f;
         myRT.offsetMin = offMin * 1.1f;
         Debug.Log(gameObject.name + " Selected");
     }
     public void OnDeselect(BaseEventData data)
     {
         myRT.offsetMax = offMax;
         myRT.offsetMin = offMin;
         Debug.Log(gameObject.name + " Deselected");
     }
 }

Get the transform as RectTransform and cache the current offset values. Scale the offsets in Select and put them back to the cached value on Deselect.

Comment
Add comment · Show 11 · 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 siddharth3322 · May 06, 2016 at 01:46 PM 0
Share

@meat5000, Thanks for your awesome reply but I have one question now. If I have 6 buttons then I need to write 6 scripts like this? any way exist through which I can detect button as well.

avatar image meat5000 ♦ siddharth3322 · May 06, 2016 at 01:55 PM 0
Share

Simply use this

http://docs.unity3d.com/ScriptReference/EventSystems.BaseEventData-selectedObject.html

to detect which button is pressed.

 public void OnSelect(BaseEventData data)
 {
     if(data.selectedObject.name == "$$anonymous$$yButton")
     {
         myRT.offset$$anonymous$$ax = off$$anonymous$$ax * 1.1f;
         myRT.offset$$anonymous$$in = off$$anonymous$$in * 1.1f;
     }
 }
avatar image Briksins meat5000 ♦ · May 06, 2016 at 02:04 PM 1
Share

No, you dont do like that!

You create 1 script, and apply the same script to each button. on select event it will trigger own instance of the script, you dont even need to care of the button name

Show more comments
avatar image siddharth3322 · May 07, 2016 at 02:49 PM 0
Share

@meat5000, why we are changing offset value here? I want scale up down of selected object.

avatar image meat5000 ♦ siddharth3322 · May 07, 2016 at 05:08 PM 0
Share

As I mentioned in a comment, actually changing the scale of the RectTransform can alter the sprite in a way that prevents click detection in the correct areas. The proper way to scale a UI element is to adjust the corners of the rectangle with respect to the position of the Anchors.

http://docs.unity3d.com/ScriptReference/RectTransform-offset$$anonymous$$ax.html

Did you try the script? The buttons will grow by 10% when clicked.

avatar image meat5000 ♦ meat5000 ♦ · May 08, 2016 at 10:52 AM 1
Share

The pointers in the Standalone Input module take care of the touch and mouse, since the Touch Input $$anonymous$$odule was deprecated. Check out the class in the Scripting API for more info. The end result will be the same.

The offset values are a normalised scale respective to the position of the anchors. You should place the anchors where you want your reference box to be for that element. For example you can position your anchors at the biggest size you want the element to be and in the correct position and then use an offset value of 0.9 and 1 ins$$anonymous$$d of 1 and 1.1.

Really using the offsets is just one way of doing it. If you read the RectTransform docs you will discover many more useful variables and methods to help you get the behaviour you want.

The important thing in this answer was the Implementation of the interfaces in order to use the desired functions for each behaviour. What you do within those functions is up to you. Just remember that there is much useful information provided to these Interfaces through BaseEventData and PointerEventData.

Show more comments
avatar image
1

Answer by Briksins · May 06, 2016 at 11:32 AM

You need to use custom script, where you detect when button in focus

According to API "Button" Class implements ISelectHandler which has method OnSelect, it should fire off each time when your button selected. Once you capture this event you need to get selected button RectTransform component and scale from there

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 siddharth3322 · May 06, 2016 at 11:34 AM 0
Share

@Briksins, Okay I understand your custom script concept. but how to detect particular controls focus enter and focus leave?

avatar image Briksins siddharth3322 · May 06, 2016 at 11:37 AM 0
Share

just updated my response with exact class names, interfaces and method name

avatar image meat5000 ♦ · May 06, 2016 at 11:38 AM 0
Share

Note that some users report that adjusting the scale of a UI element messes with the click detection. Scale using anchors etc.

avatar image siddharth3322 · May 06, 2016 at 11:42 AM 0
Share

@Briksins and @meat5000, now let me implement all this.

avatar image siddharth3322 · May 06, 2016 at 02:06 PM 0
Share

@Briksins, this one also cool answer, I up voted your answer too.

"No, you dont do like that!

You create 1 script, and apply the same script to each button. on select event it will trigger own instance of the script, you dont even need to care of the button name"

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

68 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

Related Questions

Can I use EventSystem + InputModule to implement scroll via button? 0 Answers

UI button not working 1 Answer

Changing the target of a button that takes a gameobject as a parameter? 0 Answers

Is it wise to add scripts to Unity's Event System? 0 Answers

inheritance vs multiple component for UI 1 Answer


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