8000 GitHub - hafewa/TwentyFiveSlicer: A Unity package for handling advanced 25-slice sprites.
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

hafewa/TwentyFiveSlicer

 
 

Repository files navigation

Twenty Five Slicer

Twenty Five Slicer is a Unity package designed for more advanced sprite slicing, enabling a "25-slice" approach. It divides a sprite into a 5x5 grid, allowing precise scaling and manipulation of individual regions while preserving key areas.

9-slice vs 25-slice

9-slice vs 25-slice 9-slice vs 25-slice 2

Key Concept

25-slice Debugging View

  • 9 slices: Non-stretchable areas.
  • 6 slices: Stretch horizontally only.
  • 6 slices: Stretch vertically only.
  • 4 slices: Stretch in both directions.

This allows for far more detailed slicing. Where traditional 9-slice images often require stacking multiple image layers to achieve complex UI shapes (e.g., speech bubbles, boxes with icons or separators at the center), a 25-slice configuration can often handle these scenarios with just a single image.

How to Use

Installing the Package

  1. Open the Unity Package Manager.
  2. Select Add package from Git URL.
  3. Enter: https://github.com/kwan3854/twentyfiveslicer.git
  4. To install a specific version, append a version tag: https://github.com/kwan3854/twentyfiveslicer.git#v1.0.0

Create Slice Data Map (First-time Setup)

  1. Navigate to the Assets/Resources folder. (Create the folder if it doesn’t exist.)
  2. Right-click -> Create -> TwentyFiveSlicer -> SliceDataMap

How to Add 25-slice DataMap SliceDataMap Example

Editing a Sprite

  1. Open the 25-Slice Editor:
  • Window -> 2D -> 25-Slice Editor

How to Open 25-Slice Editor

  1. Load Your Sprite:
  • Drag and drop your sprite into the editor or select it via the provided field.
  1. Adjust the Slices:
  • Use the sliders to define the horizontal and vertical cut lines, dividing the sprite into 25 sections.
  • Borders are displayed visually for accurate adjustments.

25-Slice Editor

  1. Save the Configuration:
  • Click Save Borders to store the 25-slice settings.

Using the 25-Sliced Sprite

  1. Create a TwentyFiveSliceImage GameObject (or add the component to an existing GameObject):

How to Add 25-Slice GameObject

  1. Assign the Sliced Sprite:
  • In the TwentyFiveSliceImage component, assign the sprite as you would with a standard UI Image.

Key Features

  • Divide sprites into a 5x5 grid for highly detailed control.
  • Seamlessly scale and stretch specific sprite regions.
  • Fully compatible with Unity’s UI system for dynamic layouts.
  • Intuitive editor with clear visual guidance for precise adjustments.

For more information or contributions, visit the repository.

Delete Unused Data

Tools -> Twenty Five Slicer Tools -> Slice Data Cleaner

About

A Unity package for handling advanced 25-slice sprites.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • C# 100.0%
0