chenbo007 / svg-edit

Automatically exported from code.google.com/p/svg-edit
0 stars 0 forks source link

Possibility to clone the style of an element #115

Closed GoogleCodeExporter closed 9 years ago

GoogleCodeExporter commented 9 years ago
It would be interesting, maybe, to be able to copy/paste = clone the style
of an element to apply it to one or several other selected elements (as we
have no color picker tool in the vertical toolbar). This would also allow
copying a gradient, which is hard to achieve with a color picker tool.

I don't know how that could work in terms of UI - without adding a button.
Maybe have a new item in the current clone "multiple" icon, like the
square/rectangle/free rectangle, which would "clone the style of the first
element selected to the other(s)", or "clone the style of the last element
to ther other(s)"...

(This is a request for enhancement in the future)

Original issue reported on code.google.com by worms_...@yahoo.com on 23 Aug 2009 at 8:08

GoogleCodeExporter commented 9 years ago
Hm, interesting idea.  Here's an idea for a UI:  an Eye-Dropper tool.

1) user clicks the Eye Dropper tool in the side toolbar
2) the mouse cursor turns into an empty eye dropper
3) user clicks an element, this 'sucks up' that element's style and now the eye
dropper cursor is filled with 'ink'
4) user clicks any number of elements to apply that 'sucked-up' style 

"Style" includes the following:  fill, fill-opacity, fill-style, stroke,
stroke-opacity, stroke-width, stroke-dasharray, opacity

Would that work?  Depending on input from users, we might want to target this 
for 2.4
as the above implementation would be reasonably simple (only tricky part is 
actually
implementing the custom cursor since it's not ubiquitously supported across 
browsers.

Original comment by codedr...@gmail.com on 24 Aug 2009 at 2:19

GoogleCodeExporter commented 9 years ago
I like the idea of an eye dropper tool, very much :-)

It could also be called a vamp' tool, as it would "suck" an object, and "revamp"
others ;-)

Original comment by worms_...@yahoo.com on 24 Aug 2009 at 9:03

GoogleCodeExporter commented 9 years ago

Original comment by codedr...@gmail.com on 17 Sep 2009 at 3:33

GoogleCodeExporter commented 9 years ago

Original comment by codedr...@gmail.com on 11 Jan 2010 at 11:08

GoogleCodeExporter commented 9 years ago
I found I needed this quite often when I was using SVG-edit to draw a comic.

Original comment by codedr...@gmail.com on 11 Jan 2010 at 11:08

GoogleCodeExporter commented 9 years ago
With implementation of Issue 384, we need to carefully think about groups and 
this
feature.

My suggestion is that the eye dropper tool would only work on individual 
shapes, not
groups (because a group will most likely not have consistent styling applied 
across
all its descendant shapes).

Is this ok?

Original comment by codedr...@gmail.com on 2 Feb 2010 at 6:33

GoogleCodeExporter commented 9 years ago
Yes. Ideally, one should be able to select a single shape, and apply its style 
to one
or multiple selected individual shapes. So indeed, no groups should be involved 
(you
couldn't copy the style of a group, and you couldn't paste a style to a group 
either).

Original comment by worms_...@yahoo.com on 2 Feb 2010 at 8:09

GoogleCodeExporter commented 9 years ago
Actually I think pasting to a group should be allowed (since groups can now be 
styled
as of last night).

Wormsxulla - do you think the eye-dropper is a good metaphor for this?  Empty 
for
when you need to pick and full with paint when you need to click on an element 
to
apply it?

I forget: Does Firefox support a way of doing custom cursors?

Original comment by codedr...@gmail.com on 2 Feb 2010 at 8:12

GoogleCodeExporter commented 9 years ago
Ok for pasting to a group (even though I still think it's odd to be able to set 
a
style on a group, but OK.)

Yes, an eye-dropper (the ones which look like this shape:
http://www.clker.com/clipart-28676.html ) would be fine.

Huh. Custom cursors in Firefox... works... works not:
https://bugzilla.mozilla.org/buglist.cgi?short_desc_type=allwordssubstr;order=Im
portance;short_desc=custom%20cursor;query_format=advanced

https://bugzilla.mozilla.org/show_bug.cgi?id=541182

It depends! ;-)

Original comment by worms_...@yahoo.com on 2 Feb 2010 at 8:54

GoogleCodeExporter commented 9 years ago
Hi,
I don't really want to hurt the flow of this conversation, but I use this 
feature
extensively in Microsoft Office products including Visio.  In the Microsoft UI, 
we
have something called the format painter.  I want to give input and support for 
an
SVG-edit feature to work in the same manner.

The format painter works like this:
1. Select an object whose properties you want to copy.
2. Click on format painter button.
3. Click on the object you want to apply the properties to.

If you want to port the properties on to multiple objects:

The format painter works like this:
1. Select an object whose properties you want to copy.
2. Double-click on format painter button.
3. Click on each object you want to apply the properties to. (one at a time).

In Office, during single-click format painter, the pointer resets after first 
click.
 I am guessing we don't need to make it reset unless user specifically requests,
thereby skipping the whole multiple select procedure.  

Can we use the same technique here? Your thoughts?

Original comment by anas.has...@gmail.com on 29 Mar 2010 at 12:25

GoogleCodeExporter commented 9 years ago
Hello Anas,

I think the major challenge (conceptually for me) is the UI design for this 
feature.
 Writing code to actually grab and apply format/paint shouldn't be the problem, but
how do you represent this to the user?

For instance, should the cursor turn into a full eye-dropper when you click on 
the
'format painter' button?  If so, how to achieve this in a consistent, 
cross-browser
manner?

I'm also unclear on how you exit 'format painter' mode in the multiple object
scenario you describe?  Just the format painter button just stay selected until 
you
click on another tool?

I'm tempted to just say that the format-painter/eye-dropper button is just 
another
mode/tool that you can click on and until you click on a different tool, each
selected element gains the style.

How about this:

1) introduce an eye-dropper tool
2) the eye-dropper tool is only enabled when a single element is selected
3) if the eye-dropper tool is clicked, then SVG-edit stores the paint 
properties of
the selected object, and de-selects the object
4) when in eye-dropper mode, any element clicked on gains the paint propertes
5) when in eye-dropper mode, multi-select mode is not enabled

Are these requirements good enough?

Original comment by codedr...@gmail.com on 29 Mar 2010 at 12:36

GoogleCodeExporter commented 9 years ago

Original comment by codedr...@gmail.com on 29 Mar 2010 at 2:12

GoogleCodeExporter commented 9 years ago
I checked in an extension for an eye-dropper tool for the requirements 
mentioned in
Comment #11.  Folks should test it and speak up if they want to see improvements
before I close the bug.

Original comment by codedr...@gmail.com on 29 Mar 2010 at 3:23

GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
Ok, I'll mark this as fixed in r1486 and make subsequent improvements after

Original comment by codedr...@gmail.com on 29 Mar 2010 at 3:30