Welcome, Guest. Please login or register. Did you miss your activation email?

Author Topic: Selba Ward  (Read 33961 times)

0 Members and 1 Guest are viewing this topic.

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #15 on: December 20, 2015, 02:34:07 am »
Added new object: Nine Patch

Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

Mario

  • SFML Team
  • Hero Member
  • *****
  • Posts: 877
    • View Profile
Re: Selba Ward
« Reply #16 on: December 22, 2015, 09:13:02 am »
I'd probably use a different texture to show this off, maybe some borders similar to classic Windows 95 look. Just something that feels less "stretched", even if it isn't the case. :)

Yatan vesh

  • Newbie
  • *
  • Posts: 17
  • Get busy livin',or get busy dyin'
    • View Profile
Re: Selba Ward
« Reply #17 on: December 22, 2015, 01:20:05 pm »
Your Sprite 3D thingy is just awesome!  :) :)
 I'll surely use it when i'm working on a new project. Thanks for sharing dude!

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #18 on: December 22, 2015, 10:42:33 pm »
I'd probably use a different texture to show this off, maybe some borders similar to classic Windows 95 look. Just something that feels less "stretched", even if it isn't the case. :)
You're totally right. It was just a quick texture that I threw together to test it with. I'll have a look at something a little thinner around the edges  ;)

Your Sprite 3D thingy is just awesome!  :) :)
I'll surely use it when i'm working on a new project. Thanks for sharing dude!
Thank you!
Glad you like it and you're welcome  :)
Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #19 on: December 24, 2015, 10:15:25 pm »
Added new object: Pie Chart

Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #20 on: December 24, 2015, 11:32:42 pm »
Created new Nine Patch texture so that it will no longer look stretched.

New texture:


New screenshot:
Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

Mario

  • SFML Team
  • Hero Member
  • *****
  • Posts: 877
    • View Profile
Re: Selba Ward
« Reply #21 on: December 27, 2015, 09:56:49 pm »
Ah, that's a lot better. :) Didn't dig through the code so far. How do you scale the center parts? Do you repeat, stretch, or is there an option for this?

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #22 on: December 28, 2015, 01:05:19 am »
Thanks :)
The (non-corner) sections are scaled.
The object is based on this concept.
Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

Elias Daler

  • Hero Member
  • *****
  • Posts: 587
    • View Profile
    • Blog
    • Email
Re: Selba Ward
« Reply #23 on: December 28, 2015, 09:31:02 am »
Nice stuff! I think I need to use this technique for menus in my game.
Here's how the sprite looks (scaled 4x):

You can use this sprite as an example on github if you want :D
Tomb Painter, Re:creation dev | eliasdaler.github.io | @EliasDaler | Tomb Painter dev log

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #24 on: December 29, 2015, 11:26:25 pm »
Menues must be the reason that the 9patch exist.

@Elias Here's the texture you'd need to recreate that texture you just posted using Selba Ward's Nine Patch!
(also scaled x4)

Here's the actual texture:

The result when used in the example (no cursor shown):


One good thing about it is that the setup is all in the texture; there's no need for extra data. The parts that stretch are indicated inside the image file itself!
« Last Edit: December 29, 2015, 11:46:10 pm by Hapax »
Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

Elias Daler

  • Hero Member
  • *****
  • Posts: 587
    • View Profile
    • Blog
    • Email
Re: Selba Ward
« Reply #25 on: December 29, 2015, 11:34:38 pm »
Yeah, it's cool that it saves lots of place and I can reuse this in a lot of ways. I can even draw a transparent border and then use some tiled texture for the background (which can lead to some customization like most of the old RPG's allowed you to do :D)

Btw, why isn't is completely symmetrical?
Tomb Painter, Re:creation dev | eliasdaler.github.io | @EliasDaler | Tomb Painter dev log

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #26 on: December 29, 2015, 11:49:19 pm »
Btw, why isn't is completely symmetrical?
It's the encoded data. It requires a transparent border that is one-pixel thick. In that border, black lines describe how it is to be used. The black line on the top and left show which part of the texture is to be stretched. Selba Ward's version doesn't make use of the right and bottom lines, which describe where content should go, although I will be adding a way to retrieve that information.

The black lines don't have to be two-pixels (or more) long, they can be just a single pixel!

My version has the added bonus that if no black lines (guides) are present, the entire image is stretched to match the given size. Can be useful if you need to rescale to a specific size rather than scale.
(click to show/hide)

Have a look at my previous post. I edited it to show my version of your texture in use!  :)

EDIT: For more information on the 9patch and a view of what the black lines look like on all four sides, see this article.
« Last Edit: December 30, 2015, 12:02:47 am by Hapax »
Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

Elias Daler

  • Hero Member
  • *****
  • Posts: 587
    • View Profile
    • Blog
    • Email
Re: Selba Ward
« Reply #27 on: December 30, 2015, 08:22:15 am »
Oh, that's pretty clever! Stretched box looks great. :D
Tomb Painter, Re:creation dev | eliasdaler.github.io | @EliasDaler | Tomb Painter dev log

SpeCter

  • Full Member
  • ***
  • Posts: 151
    • View Profile
Re: Selba Ward
« Reply #28 on: December 30, 2015, 02:25:13 pm »
Cool thing, but I only know that technique as 9-Slice though :D

Hapax

  • Hero Member
  • *****
  • Posts: 2775
  • My number of posts is shown in hexadecimal.
    • View Profile
Re: Selba Ward
« Reply #29 on: January 02, 2016, 09:42:43 pm »
Oh, that's pretty clever! Stretched box looks great. :D
Nine Patch is really new to me - I only saw it for the first time a few days ago - but as soon as I saw it, I knew I had to implement it!

Cool thing, but I only know that technique as 9-Slice though :D
Thanks  :)
I just looked up "9 slice" and I see what you mean! It looks like it's also called that by other companies. I guess you can always:
sw::NinePatch nineSlice;
;)
Selba Ward - SFML drawables
Kairos - Timing Library
Rectangular Boundary Collision - Rectangular SAT Collision

@Hapaxiation - Hapaxia on Twitter

 

anything