Learning SVG...

[sabisgeek]

Okay, been around here for a while, produced some themes, not too bad.
But now, I think i'm ready to start seriously developing themes with SVG. Not the little things you change in Theme Builder, no, something more in-depth.
So, to get to the point, anyone know a good place to start learning how to create and edit .svg files? I'm practically a novice with svg, so i need something that is really informative and helpful. And before you ask, YES, I googled it, and of course, nothing i thought was helpful showed up.

And a BIG thank you to EVERYONE who helps.

[sabisgeek]

Noone? Bump, if you don't know

Posted from my CrackBerry at wapforums.crackberry.com

[mrtolles]

3 Hours and 55 minutes and you bump your own message? You have to give enough time for those who can answer you question time to help. In that time frame, there were only 2 other posts in this Theme Developers Forum... In a Post that references SVG in the title... Just Saying.

SVGs or Composer has many many different aspects of what you can do with it. A simple search for SVG on this forum will pull up plenty of results (500) that you will have to dig through, but also give you plenty of ideas and how to pull them off. There is no definitive guide on Theme building all in all, but if you narrow your desires of what you want to learn next, there are plenty of guides you can find here. I would say this forum has the "most" resources, but not really organized and you have to pour through many forum post. BBThemeLab also has many guides that are better organized with out having to read forum posts. They also have a forum, but again many post to dig through. Hope this helps.

[sabisgeek]

Thanks, mrtolles, and sorry for bumping it up so soon, but I really want to learn it

So what you're saying is, there's no guide, just little snippets of info? I'm pretty good in composer and BTB, but in svg I'm at a total loss. How did you learn SVG? Maybe that can help

Posted from my CrackBerry at wapforums.crackberry.com

[sunnylovesalman]

Use Inkscape , and if you need any help in SVG making.........I am here cos I had been a Symbian Theme maker for the last couple of yeras, and svg tits bits would be provided .

[sabisgeek]

Inkscape? What's that?
Is it an image editing program? I have Photoshop

Posted from my CrackBerry at wapforums.crackberry.com

[grimmstaBB]

I think it is safe to say that a lot of the developers here don't know a lot of SVG, just what they need to and then learn more when they want to do something. Only over the past 6 months has SVG exploded in themes thanks to this thread...http://forums.crackberry.com/f115/un...ed-svg-451094/

I know quite a bit of themeing SVG but not much about the rest, part of the problem is that themes/BlackBerry's dont support the full SVG language, if they did themes would be A LOT better.

My suggestion would be to go BBThemeLab do some basic tutorials like a sliding dock. When doing the tutorial dont just copy the code but try to understand it, once you understand what you're being told to do is when you can get creative and think outside the box. The hidden/sliding dock code is really the holy grail of SVG, the base code can be used in many ways. After you get a grip on the basics hit up the above thread and then you can really make some crazy stuff happen. There's 350+ posts but reading them all will really increase youre abilities. FYI since that thread has been created themes (IMO) have been raised to a new level, you can tell how many developers have read it.

Good Luck!

[sabisgeek]

Thanks, grimmsta!
I have already watched ALL of his tutorials (Awesome stuff) and made a couple.
So what you're saying is that themers dont know all of SVG? They only know the stuff they need to know...ok...but if i dont know ANYTHING, then how can i impliment the codes in the Undocumented SVG thread into my svg? Im really stumped now...

But thanks for the reply, and the effort!

[grimmstaBB]

Well, it's tricky, like I know how to write some code on manipulating objects across the screen using animateTransform. If you have done any dock tutorial you have most likely used this code, also, the 'set' attribute is a popular one. Basically the key to understanding what you need to know is taking a tutorial's code and breaking it down to see what it is doing. Let's take

 <animateTransform xlink:href="#icons1" id="_anim_ag0" attributeName="transform" type="translate" to="0,88" dur="0.4s" fill="freeze" begin="down.activate"/>

'animateTransform' is saying that this action is going to move or transform something
'xlink:href=' is calling up the item you want to move - it can be a layer, button, animation or anything with an ID
'id' is giving this action a unique identifier, every action in your svg will have a new one, it doesnt need to follow any specific order just unique
'attributeName' is the type of animateTransform - see here is what I am talking about when I say you dont need to know all svg, there are a lot of attributeNames but most cannot be used in themes.
'type' is well the type of transform
'to' this is saying where to move the 'xlink:href' item to, (x,y) it is relative to it's original position
'dur' is the duration of the movement aka speed
'fill' - not sure, ive only seen 'freeze' before
'begin' is when all this stuff will happen, so here it would be when the button 'down' is activated, it could be when it is focused in on ('focusin') or focused out ('focusout')

so this line of code is basically saying when the button down is pressed and released icons1 (a layer in my example) will move 88px along the x axis, and will take 0.4 seconds to get there.

I am most likely calling these attributes something they are not, it is what I think of them in my head as and it has helped me make some pretty nice themes. Reading the Undocumented thread will show that there are a lot of people out there doing themes that know a lot more about SVG than I do and are better at it; but you dont need to be an expert to make some good quality themes that are dynamic. It took me awhile to be able to break down the code like that but once I did I was able to understand other lines of code and break them down as well. Once you can read it, you will be able to write it.

Here is a tip: open up a SVG file the composer exported. start near the top and try to read the code and figure out what it is saying. if you dont kow what a tag is, google it, there are a good amount of SVG databases that will guide you. FYI <g></g> is a layer and you can name it similar to html: <g id="icons1"></g>. Composer writes a lot of inefficient code and it is repetitive, but it gets the job done. This is not an easy task but if you can manage your way through it you will see what things Composer uses and ways to call up certain objects and see what themes allow. There is a lot, and I mean a lot of trial and error when it comes to SVG coding and themes, your code may be right but the theme/BB wont read it and never will. (I've had this happen too many times and it added many hours to a 99% complete theme)

Good luck to ya, and I am sorry if this was a lot of bluberish, but I tried to explain how I do things, it's not elegant and not 100% right but it get's the job done and I can do a lot with a limited knowledge base of SVG.

[sabisgeek]

Blubberish? This is amazing! Thanks grimmsta! I had a VERY vauge Idea of what you were saying before I read it, but now its all clear. Its a really good explanation man! Actually, I tried the composer thing, but I didn't understand why for , let's say, theme button_1, there were 5 image ids or something...shouldn't it be 2? One for the focusin image and one for the focusout?

And for the <g> tag, itsnt it basically like an anchor tag in HTML? I think I heard that somewhere.

Other than that, I'm really starting to understand this more. It'll take some time, I'm sure, but with the kind of help you have, it'll take way less

Thanks!

Posted from my CrackBerry at wapforums.crackberry.com

[sabisgeek]

1 Bump please

Posted from my CrackBerry at wapforums.crackberry.com

[sabisgeek]

2nd bump....

Posted from my CrackBerry at wapforums.crackberry.com

[miz_pimp]

I don't think anyone is willing to help you (us, lol) with this one... I guess you (we, lol) need to just play around with the svg file to see what can be left out?

[sabisgeek]

Yeah...I kinda figured that out when its been 22 days since someone said someone

Posted from my CrackBerry at wapforums.crackberry.com

[Titaniumedge]

I am a coding moron, I don't understand a lot of what composer files are trying to say but I did figure out a few key points for me.

#1. Never assume that composer is just going to code the SVG properly. The first few themes I tried to make the right application would not show in the dock when I had all the theme buttons set to "use device application order". This one gave me a headache for a few days until I opened the SVG file in note pad and started looking around. I finally figured out that for some reason (probably user error lol) composer set every theme button to "slot0" and I had to go and change the 2nd,3rd,4th,5th, and 6th buttons to the proper slot #.

#2. Try commands that make sense to you. I am currently working on a theme that has an animation before my hidden dock appears. For three days I couldn't get the animate transform code to delay the movement of my dock, it drove me nuts. Finally I figured out that just by adding a "+0.5s" command at the end of the code it delayed it just like I needed it too.

#3. Always make a copy of the SVG file before you start messing with the code. I know you can just hit export again on the composer but trust me if you are messing with code it's always nice to see the original unaltered code so if you make it unusable you can refer back to the original and possibly see exactly where you messed up.

The 4th and most important thing I learned is TAKE A BREAK! Lol. If you keep plugging away at the code thinking "I'm almost there, just a few more minutes" you'll normally end up destroying your progress (and if you're like me your relationship ) by getting to overwhelmed by the code. If you feel like pulling out your hair and you're not having fun with it you are likely to make mistakes and if you have to start all over again it can really get to you and make you want to just stop trying.

Hopefully this helps a bit and have fun with making your themes, I know I love the challenge and find it really rewarding. Now I just need to learn how to render much nicer graphics and I should be all set lol. Feel free to PM me if you have any questions. Good luck!

Posted from my CrackBerry at wapforums.crackberry.com