locked
Shapes Editor for Small Basic

    General discussion

  • Latest version of Shape Editor:

    Shapes 1.5b XFZ657-15.

    To be continued:

    This thread will be continued to other thread "How to Create Animation with Small Basic".

    Top article:

    Now I'm writing a program named "Shapes Editor".

    I'm going to introduce latest "Shapes Editor" in this thread.

    This program helps to make shapes animation for your program.

    If you have any comments, please let me know.

    Thanks.

    Shapes Editor 0.72


    Nonki Takahashi






    Tuesday, September 11, 2012 8:41 AM
    Moderator

All replies

  • Today's latest version of "Shapes Editor" is XFZ657-7.

    Sample output program (with modification) is uploaded as RQB683-1.

    Sample output program


    Nonki Takahashi

    Tuesday, September 11, 2012 8:48 AM
    Moderator
  • Really cool! Keep up the great work! :)

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Tuesday, September 11, 2012 12:30 PM
  • Very nice!

    If you could add these features,

    1)Change shapes' height , width  (tuning)       (後で微調整できますか?)

    2)save it as png file     .......  maybe extension is necessary  

    (png保存できればうれしいです)

    Tuesday, September 11, 2012 1:28 PM
    Answerer
  • 1) At this moment, you can change each shape size only by editing output code.  But not so difficult because the output code is like:

    shape[1] = "func=rect;x=10;y=10;width=100;height=100;...;"

    So, you can edit numbers after "width=" and "height=".  In the future, this tool may have ability to change each shape size.

    2) There is no plan to output as bitmap image such as png, bmp, jpg, gif, ...

    This program is vector base editor.  So, someone may write converter from "Shapes Editor" output to such as SVG. 


    Nonki Takahashi


    Tuesday, September 11, 2012 2:03 PM
    Moderator
  • Thanks!


    Nonki Takahashi

    Tuesday, September 11, 2012 2:04 PM
    Moderator
  • NaochanON,

    1) I'll write code to re-size shapes as first priority.  I started to write code for rotating shapes.  But this will be complicated and need much time.  So I decided that the priority for rotation is second.  Any way, some re-sizing code will be used as rotation code also. 


    Nonki Takahashi

    Tuesday, September 11, 2012 2:47 PM
    Moderator
  • Very nice program!
    Tuesday, September 11, 2012 6:38 PM
    Moderator
  • I published XFZ657-8.

    In this version, you can change size of each shape.


    Nonki Takahashi

    Wednesday, September 12, 2012 5:35 AM
    Moderator
  • Thanks.

    Nonki Takahashi

    Wednesday, September 12, 2012 5:35 AM
    Moderator
  • Wonderful !   Perfect!
    Wednesday, September 12, 2012 6:15 AM
    Answerer
  • Today, I published XFZ657-9.

    In this version, you can rotate each shape.

    Shapes Editor 0.9


    Nonki Takahashi

    Friday, September 14, 2012 2:56 PM
    Moderator
  • My god.... I will love this tool. :)

    I want program a little game after my first program (webcode in my profil) . I will use your tool for it. -D


    Ich bin Neu

    Saturday, September 15, 2012 5:36 AM
  • I hope my tool helps your development.  Thanks.

    Nonki Takahashi

    Saturday, September 15, 2012 2:13 PM
    Moderator
  • Today, I published XFZ657-10.

    In this version, you can cut and paste each shape.

    And this version became too big.  So I couldn't publish whole of this program.

    A part of this program is published as GTV460.  This part outputs move and rotation

    code.  You can insert GTV460 after line 1147 of "Shapes 1.0" if you need.


    Nonki Takahashi


    Saturday, September 15, 2012 2:24 PM
    Moderator
  • Today, I published TLW744.

    In this version, you can read shapes from a file which is saved from output of this editor.

    Shapes 1.1

    A part of this program is published as GTV460-0.  This part outputs move and rotation

    code.  You can insert GTV460-0 after line 1220 of "Shapes 1.1" if you need.

    Sample output program (with modification) is uploaded as PSN020.


    Nonki Takahashi

    Tuesday, September 18, 2012 12:52 AM
    Moderator
  • In this version, you can also change pen width, pen color, and brush color for each shape.

    Nonki Takahashi

    Tuesday, September 18, 2012 12:58 AM
    Moderator
  • I published minor bug fix version Shapes 1.12 as XFZ657-11.

    Fixed bug : Can't select lines that are read from file.


    Nonki Takahashi

    Tuesday, September 18, 2012 6:25 AM
    Moderator
  • I have a Two suggestions for the next version.

    1). Make it so when you press delete it deletes the last object added.

    2). Have it so you can add more than one line without having to select the "Line" button every time. (And other objects)

    Thanks!

    BTW VERY useful Editor! Keep up the good work.


    One thing that is impossible is impossible no matter if it is proven so first.


    • Edited by Zock77Editor Tuesday, September 18, 2012 11:28 PM
    Tuesday, September 18, 2012 11:27 PM
    Answerer
  • I found a bug I think.

    I Drew this:

    And it came out this: RPT809 Something's wrong.


    One thing that is impossible is impossible no matter if it is proven so first.

    Tuesday, September 18, 2012 11:39 PM
    Answerer
  • This program in in the TOP 5 BEST Small Basic programs ever!

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Wednesday, September 19, 2012 1:28 AM
  • Zock77,

    Thank you for your suggestions and comment.

    1) Sure.  I sometimes pushed [delete] key actually.

    2) I understand your needs.  But how do you stop to create the lines (or other objects) ?  cf. My reference UI is shapes in Microsoft Office.


    Nonki Takahashi

    Wednesday, September 19, 2012 3:01 AM
    Moderator
  • Zock77,

    Please use Shapes 1.12 (latest version) to update your rocket.

    This is my try: RPT809-0.

    Thanks.


    Nonki Takahashi


    Wednesday, September 19, 2012 3:13 AM
    Moderator
  • Thank you!

    Nonki Takahashi

    Wednesday, September 19, 2012 3:14 AM
    Moderator
  • I just posted this program as the featured program of the week @ sbprogramming.blogger.com!

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Wednesday, September 19, 2012 3:19 AM
  • By the way, in silverlight environment, positions of rotated triangles become wrong.  So please use this tool in local environment with Small Basic IDE when you rotate triangles.

    Nonki Takahashi

    Wednesday, September 19, 2012 3:22 AM
    Moderator
  • So what I meant about the adding objects was that if you click on the line button then thereafter whenever you click it draws a line until you click on Another button.

    One thing that is impossible is impossible no matter if it is proven so first.

    Wednesday, September 19, 2012 4:00 AM
    Answerer
  • I just posted this program as the featured program of the week @ sbprogramming.blogger.com!

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Thank you very much.

    Nonki Takahashi

    Wednesday, September 19, 2012 4:08 AM
    Moderator
  • Sure!

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Wednesday, September 19, 2012 12:30 PM
  • Where can I download the latest version?

    Ich bin Neu

    Wednesday, September 19, 2012 4:17 PM
  • Nonki, can I post this program as a .ZIP download on the blog? I will show that you made it.

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Wednesday, September 19, 2012 9:09 PM
  • Today, I published latest version of Shapes 1.2 as XFZ657-12.

    Summary of Shapes 1.2

    • Supported short cut keys for cut ([Ctrl]+X), copy ([Ctrl]+C), paste ([Ctrl]+V) and delete ([Delete]).
    • Bug fixed: A frame of rotating shape doesn't appear after paste.

    Nonki Takahashi


    Wednesday, September 19, 2012 11:23 PM
    Moderator
  • Noah,

    Do you mean .zip of .exe and .dll file?

    Any way, this tool outputs Small Basic source file.  So, user needs Small Basic IDE to run the output.  Then user can import the tool from Small Basic IDE without .zip file.

    Who will use the .zip file?


    Nonki Takahashi

    Wednesday, September 19, 2012 11:38 PM
    Moderator
  • Timo,

    Today I published XFZ657-12.

    Please download from above.

    I will continue to announce future latest versions in this thread.

    Thanks.


    Nonki Takahashi


    Wednesday, September 19, 2012 11:44 PM
    Moderator
  • It will be on the blog's archives for download, even after this post is lost. The .ZIP can be used by anyone with the need for it, but they can not claim credit for it, nor abuse your TOU.

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Wednesday, September 19, 2012 11:45 PM
  • The .ZIP file would contain the source code, .EXE, and .DLL's.

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Wednesday, September 19, 2012 11:46 PM
  • So what I meant about the adding objects was that if you click on the line button then thereafter whenever you click it draws a line until you click on Another button.

    One thing that is impossible is impossible no matter if it is proven so first.

    Natural UI (like Paint).  I worried one point that how to unselect shape.  Current UI, following sequence is available.

    (1) Draw first line.

    (2) Click a point that there is no shape in canvas.

    (3) Change pen width.

    (4) Draw second line (with changed width).

    Now I'm planning to support new UI that like Paint and allows to unselect shape by click on menu bar.

    Thank you for your suggestion again.


    Nonki Takahashi

    Thursday, September 20, 2012 12:09 AM
    Moderator
  • The .ZIP file would contain the source code, .EXE, and .DLL's.

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Noah,

    OK. You can upload this tool with source, .exe, and .dll.

    By the way, I couldn't find your blog...


    Nonki Takahashi

    Thursday, September 20, 2012 12:40 AM
    Moderator
  • It has its own sticky thread, but the link to it is http://sbprogramming.blogspot.com/.

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Thursday, September 20, 2012 12:45 AM
  • Noah,

    In security point of view, only source code will be more safe, won't it? 


    Nonki Takahashi


    Thursday, September 20, 2012 1:18 AM
    Moderator
  • How so?

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Thursday, September 20, 2012 2:10 AM
  • User can't confirm there is no bad behavior such as delete or overwrite local files in .exe file before run it.  But can in source file.



    Nonki Takahashi

    Thursday, September 20, 2012 2:43 AM
    Moderator
  • It has its own sticky thread, but the link to it is http://sbprogramming.blogspot.com/.

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Thank you, I could find. Interesting site! I'll keep checking it.

    Nonki Takahashi

    Thursday, September 20, 2012 4:00 AM
    Moderator
  • Thanks! Also, thank you for pointing out the security issue, I will post yours as source code only.

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Thursday, September 20, 2012 4:05 AM
  • Timo,

    Today I published XFZ657-12.


     It's very easy! Nice!  I made this in a couple of minutes.

    Thursday, September 20, 2012 4:14 AM
    Answerer
  • NaochanON,

    Good picture!


    Nonki Takahashi


    Thursday, September 20, 2012 9:35 AM
    Moderator
  • Really cool!

    -Noah J. Buscher "Nothing is Impossible Until Proven Impossible."

    Thursday, September 20, 2012 12:10 PM
  • I published latest version of Shapes 1.31 as TLW744-0.

    Summary of Shapes 1.31

    • Supported palette loading form shapes data file.
    • Supported consecutive  shapes addition.
    • Bug fixed pinches came under a shape after pen or brush color change.

    Shapes 1.31

    Comment in line 2086 to use "Open" menu.


    Nonki Takahashi


    Thursday, September 20, 2012 1:18 PM
    Moderator
  • Thanks :D

    I download now the newest version. Sorry that I needed a so long time to answer.... But I got no message that here is a new answer (I have alert online)

    How can I copy a part of my shape? Dor example a leg of Naochan's crab?


    Ich bin Neu

    Sunday, September 23, 2012 2:14 PM
  • Following is an example of a shape copy with Shapes 1.31 :

    (1) Click "Rectangle" menu icon and draw a rectangle.

    (2) Click menu bar (to stop consecutive shape addition).

    (3) Click a rectangle (to select a rectangle).

    (4) Click "Copy" menu icon or push [Ctrl]+C.

    (5) Click "Paste" menu icon or push [Ctrl]+V.

    (6) Drag a rectangle copied to appropriate position.


    Nonki Takahashi

    Monday, September 24, 2012 1:06 AM
    Moderator
  • Thanks very much.

    Ich bin Neu

    Monday, September 24, 2012 10:42 AM
  • Nonki,

     That Shapes Editor is really quite amazing! I especially like how you made it able to save in .sb files!

    Tuesday, September 25, 2012 11:22 PM
  • Math Man,

    Thank you very much for your comment.  I did so in order to avoid comment out.


    Nonki Takahashi

    Wednesday, September 26, 2012 3:26 AM
    Moderator
  • 2) There is no plan to output as bitmap image such as png, bmp, jpg, gif, ...

    Nonki Takahashi


     Nonki and other guys ,  good news.

    1)I made a PNG image (background is transparent)  file saving  program.

    You need  Litdev extension and Data extension .

    Try this.   HRK412       It's technic is as below.

    Pname=Program.Directory+"\testpng.png"
    LDUtilities.GWCapture(Pname,"False")         '   gets a window image
    GraphicsWindow.BackgroundColor="black"
    crab= ImageList.LoadImage(Pname)
    crab=PictureTools.SetTransparencyColor(crab,"White")  '  set transparency clolor
    Pname2=Program.Directory+"\Crabpng.png"
    PictureTools.SaveImage(crab,Pname2)          '  save it as a PNG file

    2)I made your program a little simpler.    PLZ refer. 

    Monday, October 01, 2012 8:46 AM
    Answerer
  •  Nonki and other guys ,  good news.

    1)I made a PNG image (background is transparent)  file saving  program.

    You need  Litdev extension and Data extension .

    Try this.   HRK412       It's technic is as below.

    Pname=Program.Directory+"\testpng.png"
    LDUtilities.GWCapture(Pname,"False")         '   gets a window image
    GraphicsWindow.BackgroundColor="black"
    crab= ImageList.LoadImage(Pname)
    crab=PictureTools.SetTransparencyColor(crab,"White")  '  set transparency clolor
    Pname2=Program.Directory+"\Crabpng.png"
    PictureTools.SaveImage(crab,Pname2)          '  save it as a PNG file

    2)I made your program a little simpler.    PLZ refer. 

    1) Exciting!  I've got your "Crabpng.png".

    2) Simple!  I'll refer your code for next version of "Shapes" editor.


    Nonki Takahashi

    Tuesday, October 02, 2012 12:13 AM
    Moderator
  • Today, I published Shapes 1.42 as TLW744-3.

    In this version, consecutive shapes addition need to click menu item twice.

    Comment in line 2106 to use "Open" menu.

    Summary of Shapes 1.42 :

    • Supported cursor key to move a shape.
    • New UI for consecutive shapes addition.
    • Added instruction in save popup.

    Shapes 1.4 screen shot


    Nonki Takahashi






    Tuesday, October 16, 2012 8:39 AM
    Moderator
  •  高橋さん FileSave方法を考えました。 以下はどうですか?

    1886行目に以下の3行を追加すると、bufdataは自動的に"Shape20121017_123456.sb"のように保存されます。 FileLoad方法も今考えています。 1823行目のoText=AddTextBoXを

    AddMultiLineTextBox に変更し、そこに"Shape"が頭についた".sb"のリストを書き込み、

    それをスライダーでスライドして欲しいファイル名を探し、FileNameBoxに入力するやり方です。、

    Mr. Takahashi. I was thinking about how to FileSave.  What is the following?

    If you  add  following three lines to line 1886,  buf data is saved as "Shape20121017_123456.sb" automatically . I'm thinking about how to  FileLoad now.  Change oText = AddTextBoX on line 1823 to  AddMultiLineTextBox.       The list of files with "Shape**** . Sb" was added to the box.   You can search a file you wanted by slider,and then   enter thefilename into the  FileNameBox.

    Fdate=text.Append(text.Append(Clock.Year,Clock.Month),Clock.day)+"_"+text.Append(text.Append(Clock.hour,Clock.Minute),Clock.Second)
      PGDS=program.Directory+"\Shape_"+fdate+".sb"
      File.WriteContents(PGDS,buf)
    EndSub

    Wednesday, October 17, 2012 8:08 AM
    Answerer
  • Yes, your idea will make [Save] sequence simple.

    Now I'm considering that Shapes editor becomes big so Shapes will be just a editor for single picture object and other animation program should be read these picture objects and write animation program.

    just a plan

    Then for animation program, it will better that each picture object has its own name.

    So I think such as "Robot.shapes.sb" will be better than like "Shape20121017_123456.sb". 


    Nonki Takahashi


    Wednesday, October 17, 2012 9:32 AM
    Moderator
  • In your program, there isn't filename inputbox for save .

    So, I made easy code.(filename=Shape+date)

    "Robot.shapes.sb" etc will be better.

    BTW  I added  file loading codes.   PLZ refer.  QXK334

    Wednesday, October 17, 2012 11:03 AM
    Answerer
  • I LOVE this!!!!!!! It's so fun!

    I made this rather quickly, thanks to Nonki!


    I am a 10 year old that loves math, games, and computers. "Everyone is potentially great, you just have to turn it into kinetic greatness."

    Wednesday, October 17, 2012 10:01 PM
  • In your program, there isn't filename inputbox for save .

    So, I made easy code.(filename=Shape+date)

    "Robot.shapes.sb" etc will be better.

    BTW  I added  file loading codes.   PLZ refer.  QXK334

    I saw QXK334.  Interesting.  I'll consider something about [Open] and [Save] for next version of Shapes.

    Thanks.


    Nonki Takahashi

    Thursday, October 18, 2012 9:50 AM
    Moderator
  • Math Man, Good picture!  Thanks.


    Nonki Takahashi

    Thursday, October 18, 2012 9:51 AM
    Moderator
  • I'm going to feature this in a blog. Are you still considering making the Animator?

    Thanks!


    Ed Price (a.k.a User Ed), SQL Server Customer Program Manager (Blog, Small Basic, Wiki Ninjas, Wiki)

    Answer an interesting question? Create a wiki article about it!

    Wednesday, May 22, 2013 11:59 PM
    Owner
  • Thank you, Ed.

    Yes, but I've not designed animation data structure yet...


    Nonki Takahashi

    Friday, May 24, 2013 12:06 PM
    Moderator
  • I'm speechless.

    Nice job!

    -Anthony

    Friday, May 24, 2013 1:11 PM
  • Dude. Just Dude. Coolest thing in the world. Bro, I look up to you.

    0100010001110101011001000110010100101110 :)

    Saturday, June 01, 2013 8:10 PM
  • Thank you, Anthony Yarrell and ardiezc_quazhulu.

    Nonki Takahashi

    Sunday, June 02, 2013 2:11 PM
    Moderator
  • Today I uploaded Shapes 1.5b as XFZ657-15.  And sample output as RQB683-3.

    This version of Shapes is intended to support in remote (with Silverlight and web browser).

    Shapes 1.5b can be run in local.  Remove comment from lines with File object.  And save the program as filename "Shapes1_5b.smallbasic".

    Screen shot of a program Rocket 0.51

    And I'd like to announce that this thread will basically end with this article and continued to new thread for Animation here.


    Nonki Takahashi




    Wednesday, July 10, 2013 3:08 PM
    Moderator
  • I wrote a supplemental tool for Shapes editor: Converter from Shapes to PowerPoint VBA 0.1 (XQD349).

    At this time the shape array (from DuckShoot) is included in this tool.  So, to use this program, replace the shape array before run it. Following list shows the input and the output of this tool.

    Input

    Sub Sighter_Init
      ' Shapes | Initialize shapes data
      ' return shX, shY - current position of shapes
      ' return shape - array of shapes
      shX = 250 ' x offset
      shY = 200 ' y offset
      shape[1] = "func=ell;x=0;y=0;width=80;height=80;bc=#005AC3CD;pc=#FFFFFF;pw=2;"
      shape[2] = "func=ell;x=20;y=20;width=40;height=40;bc=#005AC3CD;pc=#FFFFFF;pw=2;"
      shape[3] = "func=line;x=1;y=40;x1=0;y1=0;x2=80;y2=0;pc=#FFFFFF;pw=2;"
      shape[4] = "func=line;x=41;y=0;x1=0;y1=0;x2=0;y2=80;pc=#FFFFFF;pw=2;"
    EndSub

    Output

    Sub DrawShape()
    '
    ' DrawShape
    '
        s = 100 / 211
        Set myDocument = ActivePresentation.Slides(2)
    ' shape[1]="func=ell;x=0;y=0;width=80;height=80;bc=#005AC3CD;pc=#FFFFFF;pw=2;"
        With myDocument.Shapes.AddShape(msoShapeOVal, _
            0 * s, 0 * s, 80 * s, 80 * s)
            .Line.ForeColor.RGB = RGB(255, 255, 255)
            .Line.Visible = msoTrue
            .Line.Weight = 2.4 * s
            .Fill.ForeColor.RGB = RGB(90, 195, 205)
            .Fill.Transparency = 1
        End With
    ' shape[2]="func=ell;x=20;y=20;width=40;height=40;bc=#005AC3CD;pc=#FFFFFF;pw=2;"
        With myDocument.Shapes.AddShape(msoShapeOVal, _
            20 * s, 20 * s, 40 * s, 40 * s)
            .Line.ForeColor.RGB = RGB(255, 255, 255)
            .Line.Visible = msoTrue
            .Line.Weight = 2.4 * s
            .Fill.ForeColor.RGB = RGB(90, 195, 205)
            .Fill.Transparency = 1
        End With
    ' shape[3]="func=line;x=1;y=40;x1=0;y1=0;x2=80;y2=0;pc=#FFFFFF;pw=2;"
        With myDocument.Shapes.AddConnector(msoConnectorStraight, _
            1 * s, 40 * s, 81 * s, 40 * s)
            .Line.ForeColor.RGB = RGB(255, 255, 255)
            .Line.Visible = msoTrue
            .Line.Weight = 2.4 * s
        End With
    ' shape[4]="func=line;x=41;y=0;x1=0;y1=0;x2=0;y2=80;pc=#FFFFFF;pw=2;"
        With myDocument.Shapes.AddConnector(msoConnectorStraight, _
            41 * s, 0 * s, 41 * s, 80 * s)
            .Line.ForeColor.RGB = RGB(255, 255, 255)
            .Line.Visible = msoTrue
            .Line.Weight = 2.4 * s
        End With
    End Sub

    From this output, you can create an image file with PowerPoint as following instructions.

    1. Select [HOME] [New Slide] [Blank] to create page 2 of the slide in PowerPoint.
    2. Select [VIEW] [Macros].
    3. Enter appropriate Macro Name and push [Create] button.
    4. Paste the output above into the subroutine.
    5. Close the VBA window.
    6. Select [VIEW] [Macros] and created macro.
    7. Push [Run] button.  Then the image will appear in slide 2.
    8. Select all shapes (with dragging around the shapes).
    9. Click mouse right button on the shapes.
    10. Select [Save as Picture] menu and save it as an image file.


     


    Nonki Takahashi


    Sunday, July 13, 2014 3:20 AM
    Moderator