
{"id":424,"date":"2008-08-20T09:00:17","date_gmt":"2008-08-20T08:00:17","guid":{"rendered":"http:\/\/www.matthijskamstra.nl\/blog\/?p=424"},"modified":"2009-12-03T21:00:05","modified_gmt":"2009-12-03T20:00:05","slug":"custmm-grumm-ai-2-array","status":"publish","type":"post","link":"https:\/\/www.matthijskamstra.nl\/blog\/2008\/08\/20\/custmm-grumm-ai-2-array\/","title":{"rendered":"Custmm Grumm &#8211; AI 2 Array"},"content":{"rendered":"<p>Another experiment towards <a href=\"http:\/\/www.matthijskamstra.nl\/blog\/index.php\/category\/design\/custmm-grumm-design\/\">Custmm Grumm<\/a>. This time my task was to export\/import an Illustrator file to Flash&#8230;<\/p>\n<p>Yeah, yeah; I know: you say &#8220;import to stage&#8221; &#8230; correct! \ud83d\ude09<br \/>\nBut what I need is the shape converted to code (coordinates  in the x-direction and y-direction)..<br \/>\nHa, you stopped grinning!<\/p>\n<p>Well the first part is correct.<br \/>\nYou need to import the file to the stage and give every imported shape it&#8217;s own layer.<br \/>\nThis is something that you don&#8217;t want to do by hand (I didn&#8217;t want to \ud83d\ude09 ), so I wrote a jsfl that fixes that for you  (read my post about it here: <a href=\"http:\/\/www.matthijskamstra.nl\/blog\/index.php\/2008\/08\/13\/object-to-layer-jsfl\/\">object-to-layer-jsfl<\/a>)<\/p>\n<p>After that you need to extract the values (x and y-positions form the corners of the shapes) of the files. Some thing, you don&#8217;t want that to do by hand: I have written a jsfl who does that. (read more about that here: <a href=\"http:\/\/www.matthijskamstra.nl\/blog\/index.php\/2008\/08\/06\/shape-2-array-jsfl\/\">shape-2-array-jsfl<\/a> )<\/p>\n<p>If you use these two scripts, you get: all imported shapes in different layers, and you can extract all values.<br \/>\nExample of the array:<br \/>\n[as]<br \/>\nvar shapeArrayz:Array = new Array ();<br \/>\nshapeArrayz[0] = [[20.05,169.5,0] , [62.425,169.5,1] , [104.8,169.5,2] , [104.8,169.5,0] , [104.8,211.85,1] , [104.8,254.2,2] , [104.8,254.2,0] , [62.425,254.2,1] , [20.05,254.2,2] , [20.05,254.2,0] , [20.05,211.85,1] , [20.05,169.5,2]];<br \/>\n\/\/ etc&#8230;<br \/>\n[\/as]<br \/>\nThis array off point can be used to generate the shape you just &#8220;traced&#8221;.<\/p>\n<p><a href=\"http:\/\/www.matthijskamstra.nl\/blog\/wp-content\/uploads\/custmmgrummleggenerated.jpg\" rel=\"flashbox[custmmgrumm]\" title=\"Custmm Grumm shape 2 array\"><img loading=\"lazy\" decoding=\"async\" src=\"http:\/\/www.matthijskamstra.nl\/blog\/wp-content\/uploads\/custmmgrummleggenerated-300x255.jpg\" alt=\"Generated shapes from an Array\" title=\"Custmm Grumm leg generated\" width=\"300\" height=\"255\" class=\"alignnone size-medium wp-image-429\" srcset=\"https:\/\/www.matthijskamstra.nl\/blog\/wp-content\/uploads\/custmmgrummleggenerated-300x255.jpg 300w, https:\/\/www.matthijskamstra.nl\/blog\/wp-content\/uploads\/custmmgrummleggenerated.jpg 977w\" sizes=\"auto, (max-width: 300px) 100vw, 300px\" \/><\/a><\/p>\n<p>&#8211;<\/p>\n<p>This script (below) is used to generate the points (every line has 3 points, the beginning, the end and one inbetween), and the generated shape on the right side (no points, only the shape):<br \/>\n[as]<br \/>\nvar shapeArray:Array = [];<\/p>\n<p>\/\/ visualize the points<br \/>\nfunction createPoints2 (_pointArray:Array) {<br \/>\n\tshapeArray = [];<br \/>\n\tvar point:MovieClipInLibraryWithLinkageName;<br \/>\n\tfor (var i=0; i&lt;_pointArray.length; i++) {<br \/>\n\t\tpoint = new MovieClipInLibraryWithLinkageName();<br \/>\n\t\tpoint.x = _pointArray[i][0];<br \/>\n\t\tpoint.y = _pointArray[i][1];<br \/>\n\t\tvar switchExpression:uint = _pointArray[i][2];<br \/>\n\t\tswitch (switchExpression) {<br \/>\n\t\t\tcase 0 :<br \/>\n\t\t\t\t\/\/trace (0);<br \/>\n\t\t\t\tpoint.alpha = .5;<br \/>\n\t\t\t\tshapeArray.push ([_pointArray[i][0],_pointArray[i][1]]);<br \/>\n\t\t\t\tbreak;<br \/>\n\t\t\tcase 1 :<br \/>\n\t\t\t\t\/\/trace (1);<br \/>\n\t\t\t\tpoint.scaleX = point.scaleY = .5;<br \/>\n\t\t\t\tbreak;<br \/>\n\t\t\tcase 2 :<br \/>\n\t\t\t\t\/\/trace (2);<br \/>\n\t\t\t\tpoint.alpha = .5;<br \/>\n\t\t\t\tpoint.scaleX = point.scaleY = .3;<br \/>\n\t\t\t\tbreak;<br \/>\n\t\t\tdefault :<br \/>\n\t\t\t\ttrace (&quot;Not 0, 1, or 2&quot;);<br \/>\n\t\t}<br \/>\n\t\taddChild (point);<br \/>\n\t}<\/p>\n<p>}<\/p>\n<p>\/\/ draw the new extracted image<br \/>\nfunction drawArray (_arr:Array) {<br \/>\n\t\/\/ trace (&quot;drawArray &quot;);<br \/>\n\tvar _shape:Shape = new Shape();<br \/>\n\t_shape.graphics.lineStyle (1, 0x333333, 1);<br \/>\n\t_shape.graphics.beginFill (0xcccccc);<br \/>\n\t_shape.graphics.moveTo (_arr[0][0], _arr[0][1]); \/\/ starting point<br \/>\n\tfor (var i=1; i&lt;=_arr.length; i+=3) {<br \/>\n\t\t_shape.graphics.curveTo (_arr[i][0], _arr[i][1] , _arr[i+1][0], _arr[i+1][1]);<br \/>\n\t\t\/\/ _shape.graphics.lineTo (_arr[i+1][0], _arr[i+1][1]);<br \/>\n\t}<br \/>\n\t_shape.graphics.endFill ();<br \/>\n\tthis.drawContainer_mc.addChild (_shape);<br \/>\n}<\/p>\n<p>\/\/ jumpstart everything<br \/>\nfunction init (){<br \/>\n\tfor (var j=0; j&lt;shapeArrayz.length; j++) {<br \/>\n\t\t\/\/ trace(shapeArrayz[j])<br \/>\n\t\tcreatePoints2 (shapeArrayz[j]);<br \/>\n\t\tdrawArray (shapeArrayz[j]);<br \/>\n\t}<br \/>\n}<br \/>\ninit ();<\/p>\n<p>[\/as]<\/p>\n<div class=\"update\"><strong>Update #1:<\/strong> I previously used point_mc in the code. That was a movieClip in the library with a linkage name. I changed it in the code, I hope that helps.<\/div>\n<p>Eventually I will use the points, and generated shapes to modify the shape (move a point, create a new shape) and\/or to add points.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Another experiment towards Custmm Grumm. This time my task was to export\/import an Illustrator file to Flash&#8230; Yeah, yeah; I know: you say &#8220;import to stage&#8221; &#8230; correct! \ud83d\ude09 But what I need is the shape converted to code (coordinates in the x-direction and y-direction).. Ha, you stopped grinning! Well the first part is correct. [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[22,151,21,13,11],"tags":[162,148,398,403,95,29,163],"class_list":["post-424","post","type-post","status-publish","format-standard","hentry","category-as3","category-custmm-grumm-design","category-extending-flash","category-grumm","category-urban-papercraft","tag-array","tag-custmm-grumm","tag-flash","tag-grumm","tag-illustrator","tag-jsfl","tag-shape"],"aioseo_notices":[],"_links":{"self":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts\/424","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/comments?post=424"}],"version-history":[{"count":4,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts\/424\/revisions"}],"predecessor-version":[{"id":459,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/posts\/424\/revisions\/459"}],"wp:attachment":[{"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/media?parent=424"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/categories?post=424"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.matthijskamstra.nl\/blog\/wp-json\/wp\/v2\/tags?post=424"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}