ScratchData LogoScratchData
Back to toyox's profile

SVG Dot Picture Editor for Scratch

TOtoyox•Created January 6, 2017
SVG Dot Picture Editor for Scratch
37
29
947 views
View on Scratch

Instructions

Welcome to "SVG Dot Picture Editor for Scratch"! This is dot picture editor with outputting as SVG code for scratch. ::: English Description ::: -:-:- Drawing -:-:- The white rectangle on the stage is canvas. And right of it is color palette. You choose color and draw on the canvas. And, you can redo/undo with clicking arrow bottom in left-bottom.(Clockwise: redo Conner clockwise: undo) -:-:- Making Color -:-:- There is [+] button on the bottom of color palette. Click it to make colors. After click it, you can find 3 sliders and [✓] button. The sliders means hue, brightness and vividness. Adjust them. The background color is made by you. You can choose colors from canvas with using eyedropper. It's button is left of stage, it has [+] mark. -:-:- Outputting -:-:- You can find button that has arrow and bar right of canvas. It's button to output code as SVG code. Click it and choose color to be transparent. Wait a while. Then a list appears, and code is second of it.Double click for 2 times and press Ctrl+C, and you can copy the code. And, you can get original save code of this. To load the save code, click button witch has top-right arrow is the right of canvas. -:-:- Using Code -:-:- After copy the code, paste it to text editor and save as ".svg" file. And upload the file to Scratch Editor. ::: 日本語の説明 ::: -:-:- 描く -:-:- 真ん中の白い四角がキャンバスで、その右にあるものがパレットです。パレットから色を選んで、キャンバスに描きます。 また、左下の矢印のボタンをクリックすることで元に戻す/やり直しの操作を出来ます。(時計回り: やり直し・反時計回り: 元に戻す) -:-:- 色を作る -:-:- パレットの一番下にある[+]のボタンを押してください。そうすると3つのスライダーと[✓]のボタンが出てきます。スライダーはそれぞれ色相・明度・彩度を現しています。それらを調整して出来た色が背景色に反映されます。 キャンバスの左の[+]のボタンをドラッグ&ドロップすることでキャンバスから色を選択することが出来ます。 -:-:- 出力 -:-:- キャンバスの右に矢印と棒のボタンがあります。SVGコードとして出力するためのボタンです。ボタンをクリックしたあと、透過色をクリックしてください。暫くすると、リストが表示されます。そのリストの2番目にコードがあるので、それを2回ダブルクリックし、Ctrl+Cを押すことでコピーできます。 また、このプロジェクト独自の保存形式もあります。その形式のデータを読み込むには、キャンバスの左の右上矢印のボタンを押してください。 -:-:- コードを使う -:-:- コードをコピーしてから、テキストエディタにそれを貼り付けます。そして、".svg"ファイルとして保存します。そうしたらScratch Editorにアップロードしてください。

Description

-:-:- Thanks for -:-:- @MasterOfArithmetic - HSV blocks @ebiyuu1121 - Convert number to Hexadecimal number. -:-:- And more -:-:- MSF Text Engine by me Compression block by me -:-:- Scheduled update -:-:- Fix way to draw until user drawing Change save code message Make a group Fix problem too long save code Use outline Implement optimized save code Add fill tool Add replace tool Add rectangle tool Add layer -:-:- Update Log -:-:- ver. 1.3.1 Close list "save:divided code" when project starts. ver. 1.3.0 Compressing. ver. 1.2.2 Added divided code. ver. 1.2.1 You do not have to choose color to be transparent. Close list "save: Code" when project starts. ver. 1.2.0 Added save system & Eyedropper ver. 1.1.1 Fixed bags. ver. 1.1.0 Added Infinity Redo/Undo ver. 1.0.0 Shared -:-:- example -:-:- 121B3F4EF21B3F4EF21B3F4EF21B3F4EF2F4FFDFF7FFB3F4FFD1FB3F4E21FB3F4E2FB3F4EF1BDFBF821BDFBF821BDFBF821BDFBF82F7FFB3FFFF00F7FFB31BDFBF821BDFBF82BDFBF81D5FEFF21D5FEFF21D5FEFF21D5FEFF2F4FFDFF7FFB3F4FFD1FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF21FD5FEF2F10ED93020ED9301D5FEFF21D5FEFF21D5FEFF217FFF0027FFF001D5FEFF210ED930210ED93020ED930D5FEFF1FF00002FF00007FFF007F00FF17FFF0027FFF007F00FF17FFF00210000FF20000FF0ED930FF001007FFF21007FFF2007F00FF17FFF0027FFF007F00FF7FFF000000FF17FFF00210ED93027FFF100FF0021007FFF2007FFF007F00FF7FFF007F00FF17FFF0020000FF7FFF0010000FF217FFF00217FFF002FF001007FFF2007F00FF7FFF007F00FF17FFF0020000FF17FFF0020000FF7FFF100FF00200FF001007FFF21007FFF2007F00FF17FFF00217FFF00210000FF21002FF7FFF00 -:-:- 余談 -:-:- BMPファイルをSVGのドット絵に変換するのをCで書いていたんですが、しばし休憩ということでなんとなく作ってたらできました。まぁCで作ってる奴が完成するかどうかもわかりませんが。

Project Details

Project ID138822162
CreatedJanuary 6, 2017
Last ModifiedAugust 7, 2017
SharedJanuary 16, 2017
Visibilityvisible
CommentsAllowed