I agree, it can be a pain to do with SVG 1.1, but it is possible. carto.net has had some example of textbox widgets since a long time: http://www.carto.net/papers/svg/gui/textbox/
Lively kernel rolled their own multi-line text editor for editing code: http://www.lively-kernel.org/ And it just so happens that I've also been working on an SVG-based text editor for a course project this semester. I haven't released it yet, but probably will in the next week or two. I'm still deciding how to license it. Is your application something that would be compatible with the GPL? I actually don't think your requirements would be too difficult to implement. Here are my thoughts: On 11-01-19 02:37 PM, [email protected] wrote: > > > I would like to stretch the shape as they type reach character if > the text they are entering is approaching one of the other fields on > the shape, or the edge of the shape. I'd like to shrink the shape, if > they rub out a character. They should be able to click into the middle > of the text, and drive left and right with the cursor keys. I don't > need to support tabbing from one field to the next. > My experience has been that keyboard handling support is good in all of the major browsers (although I haven't tried IE), so I think you won't have any trouble attaching listeners and receiving events for each of the text elements. To resize your shapes, you would basically just get the bounding box of the text (using element.getBBox()) after every keyboard event, and then dynamically alter the path, as you suggested, or simply scale the shape. You would, however, need to roll your own cursor, keep track of its position and update its representation in DOM on left and right keypresses. You would also need to map its position to the index of the text element's textContent property, and use that to indsert or delete characters. > > > > The shape is quite complex, so expanding or shrinking while they > type may need the path 'd' attribute value to be changed dynamically. > Is that an okay idea, or do I need to try to design the shapes' > geometry to avoid it? > I think this depends on what you're trying to represent, and how complex you want the math to be when updating the shape. An easy way out might simply be to scale the shape such that its bounding box encompasses the text's bounding box. This would be very easy to implement. > > > > I'd also like to support drop-down lists around the text input (for > 'standard values' or their most recent entries) > Again, you would need to roll this widget from scratch, or use an embedded HTML menu inside a foreignObject. > > > > > Would someone please point me at the stuff I should be reading or > googling-for to understand the available approaches to text input? > Simple searches like "SVG text input" doesn't seem to find anything > helpful. > Take a look at the spec: http://www.w3.org/TR/SVG11/text.html Especially the scripting interfaces: http://www.w3.org/TR/SVG11/text.html#DOMInterfaces > > > > > Do I need to handle every key stroke myself, or are there some > helper mechanisms that I can hook into? For example, when I used to do > X-Windows stuff, editing could be handled by a widget, but it was > possible to look at every character too (both before and after the > widget saw it, I think; 19 years ago, so I may be wrong). > You need to handle every stroke yourself. I'm not aware of a higher-level mechanism, and I'm also not aware of any developer-facing GUI libraries that people have written around this low-level mechanism. > > > > > I'd like to get reasonably wide deployment (when Firefox 4, and IE9 > arrive). > > Should I be constraining myself to SVG 1.1, and ignore the SVG 1.2 > (I see that 1.2 seems to have editable text support)? > You will need to constrain yourself to SVG 1.1. Unfortunately, while SVG 1.2 does include support for editable text, I think that of all the browsers, currently only recent versions of Opera supports it. I have to say though, it's very impressive. They have a demo where you can edit text on a spiral path. Very cool stuff. > > > > Or, should I be using XHTML too, and abandon a pure SVG approach? > Speaking from experience, if you don't need multiline text editing, I think you can put together a basic SVG text input widget in less than a day. However, using HTML would probably be less work, overall. HTML gives you text input widgets, which is certainly at a higher level than what SVG gives you. The thing I'm not sure about is whether it will be possible for you to get a proper bounding box from the embedded HTML text input element. This is probably something you would want to prototype. Good luck! Jake [Non-text portions of this message have been removed] ------------------------------------ ----- To unsubscribe send a message to: [email protected] -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ----Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> Your email settings: Individual Email | Traditional <*> To change settings online go to: http://groups.yahoo.com/group/svg-developers/join (Yahoo! ID required) <*> To change settings via email: [email protected] [email protected] <*> To unsubscribe from this group, send an email to: [email protected] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
