Search Unity

Question Looking for Help/Guidance Building A Hitbox Editor

Discussion in 'UI Toolkit' started by greatlakegames, Nov 17, 2022.

  1. greatlakegames

    greatlakegames

    Joined:
    May 7, 2018
    Posts:
    6
    Hi there, I'm currently working on a fighting game and I was looking to create a custom editor window using UI Toolkit to edit hitboxes.
    I already understand the basics of UI Toolkit but I'm stuck on what my next step. Currently the goal is to have a view that the user can pan around and zoom in a out of (similar to the Scene view in the Editor when in 2D mode). The view should display a sprite at the origin, and any hitboxes the player has created for that sprite. Each hitbox should be selectable and have bounding box handles that can be used to adjust the size of the hitbox.

    Here's a sample mockup of what I'm imagining:


    Does anyone have any experience or advice in implementing such a view using UI Toolkit? Any help would be greatly appreciated, thanks!
     
  2. SimonDufour

    SimonDufour

    Unity Technologies

    Joined:
    Jun 30, 2020
    Posts:
    572
    You could look into the 2d packages to see how Unity does the sprite editor ;)

    Are you editing the sprite directly in the scene view?

    I would do all handle using separate visual element. With this you can change the style of the square to hilight the control and change the mouse to indicate the possible actions.

    There are a few posts already on the forum for handling drag events: this would have to be done programmatically.
     
  3. greatlakegames

    greatlakegames

    Joined:
    May 7, 2018
    Posts:
    6
    What 2D packages are you referencing? I don't see any source code I could look at for the sprite editor, though that would be super useful!

    I'm also debating just creating a separate window and leveraging the scene view, but I'd prefer to have a all-in-one editor if possible.

    Does anyone know of any visual elements that allow me to draw the sprite, handle click/drag events, and allows me to pan/zoom the view?

    Thanks for the help so far!
     
  4. SimonDufour

    SimonDufour

    Unity Technologies

    Joined:
    Jun 30, 2020
    Posts:
    572
    When you create a new 2d game template, a few packages are imported: https://docs.unity3d.com/Manual/Quickstart2DSetup.html

    2D Animation, 2D Pixel Perfect, 2D PSD Importer ,2D Sprite ,2D SpriteShape , 2D Tilemap Editor

    You can import the 2d feature set in the package manager to get all of them installed.

    Once in your project, you can browsed the imported package in the project view, under packages :
    upload_2022-11-21_16-43-11.png

    If you want to use the search bar, just make sure you select the option to search in "all" or "in packages"
    upload_2022-11-21_16-44-59.png
     
  5. SimonDufour

    SimonDufour

    Unity Technologies

    Joined:
    Jun 30, 2020
    Posts:
    572
    You can see in this tutorial the sprite editor in action, with all controls included:

    upload_2022-11-21_16-47-19.png
     
  6. greatlakegames

    greatlakegames

    Joined:
    May 7, 2018
    Posts:
    6
    Holy cow! Didn't know we had access to these files! Thanks for all the help, will definitely be studying these over the next few days.
     
    SimonDufour likes this.