paddy-sketch-plugin icon indicating copy to clipboard operation
paddy-sketch-plugin copied to clipboard

[Enhancement] User interface in inspector panel

Open DWilliames opened this issue 6 years ago • 6 comments

It would be great to give users the option of displaying padding/spacing details within Sketch's right inspector panel. Similar to how 'resizing is displayed'.

Then, optionally, user's could 'turn off' the values in the layer names. Sometimes it's helpful to view the values within the layers names in the layer list, to quickly glance at. Sometimes, it is unnecessary, and makes it cluttered.

DWilliames avatar Feb 11 '18 09:02 DWilliames

I was just thinking that in the future versions you might want to migrate the padding/alignment properties off the element name. This seems the most appropriate approach. Similar to Anima App's pin panel, Paddy can have its own panel.

vic-tian avatar Feb 16 '18 02:02 vic-tian

to add to what @vic-topcoder said, there is an easy way to store values on layers:

context.comand.setValue_forKey_onLayer(
    value,
    "key",
    layer
  )

var value = context.comand.valueForKey_onLayer(
    "key",
    layer
  )

mathieudutour avatar Feb 16 '18 09:02 mathieudutour

Yep @vic-topcoder @mathieudutour. That's exactly what I was thinking too!! 👍

I hope to get around to working a UI sometime soon

DWilliames avatar Feb 17 '18 04:02 DWilliames

Let me know if I can help in any way with the design. I’ll do some mocks but I’m really not a programmer.

In reality there are way too many options to establish layout of n Sketch now, but none does exactly what an inclusive system should cover. I’m really hoping Paddy would be a great engine to cover all options.

@DWilliames - what is the roadmap of Paddy, and what would you want to achieve with this it in the long run? I’m asking as I’ve seen a lot of plugins come and go, and auto layout seems the only one still maintained.

Superb job and really excited with Paddy!

vic-tian avatar Feb 17 '18 21:02 vic-tian

Thanks heaps @vic-topcoder, I really appreciate it! I will definitely let you know!

That's a really good question about the roadmap of Paddy.

I guess right now my focus is on getting Paddy really stable and performant. Right now there are still a couple of performance issues and bugs; I really want to get them ironed out as my highest priority.

My main reason for wanting to build some sort of UI would be to reduce the barrier of entry of learning how to use Paddy; as well as making it easier to configure. There's only so much configuration you can do via a layer name :P

I want Paddy to be really really good at automating padding, spacing and alignment. I don't really want to expand its arsenal too much more than that. I want it to be focused on those core pain-points; and execute it really well. Expanding Paddy to do 'everything' would create too much opportunities for more bugs, and would also invite itself to adopt more and more features – bloating it out.

For the UI; I want to make it optional for users — sometimes having extra cluttered UI that lives there (e.g. Craft, Anima, Magic Mirror etc.) is really annoying. If I do manage to add some custom UI in the inspector; I want it to feel native, as if Sketch built it themselves. But the 'alert' that appears for entering padding, could also be a custom panel; that only appears to enter padding, rather than persisting in the inspector.

I was thinking it would also be good to have some sort of settings for Paddy. Where someone could manage their variables #14 etc. or set a couple of other preferences e.g. pixel-fitting alignment and padding.

That's a bit of a brain dump — I should probably start noting this down with a bit more structure; and start throwing around a few more concrete ideas/examples to start refining.

What are your thoughts?

DWilliames avatar Feb 24 '18 16:02 DWilliames

my I interject here, I think any layer or symbol has your padding parameter doesn't need sketch grouping pin option.so you can hide that if possible then, for simple sketch interface I would suggest panel like for shadow we have with four input box for T,L,B,R . and when user types in any one of the boxes all boxes will get updated, and when user types into the second box the opposing box get's updated to make it more efficient. Also, I don't know whether it will help you with updating issue or not but, I think for better management you should create a symbol with empty border and fill, attach padding properties to that.and make the background layer fit to the borders of the symbol or group which contains the padding symbol.using sketch own pining option. In the feature, if you plan on making padding, even more, user-friendly, the user just needs to resize the said empty padding symbol normally like any object or layer and you can make it so that corresponding padding properties get's updated in the inspector panel. Just brainstorming here sorry, if I went overboard.

Raghav789 avatar Mar 04 '18 17:03 Raghav789