Page 1 of 2 12 LastLast
Results 1 to 25 of 39

Thread: [TuT]Let's paint on SMART! (Easy)

  1. #1
    Join Date
    Aug 2007
    Location
    Colorado
    Posts
    7,421
    Mentioned
    268 Post(s)
    Quoted
    1442 Post(s)

    Post [TuT]Let's paint on SMART! (Easy)

    Painting on SMART
    By Flight

    I've seen quite a few posts on the forum for people wanting to know how some scripts are able to paint on SMART, so I'm gonna show you how I do it.

    Things may or may not be 100% accurate, and I'm sure there's better ways of doing so, but this is simple enough to understand.

    Requirements:


    What we'll cover:
    • Writing text on SMART
    • Painting an image on SMART



    Step One: Getting our procedures

    Starting off we're gonna need to import 'PaintSmart.scar' from the SRL Include so we can use it within our script. Let's do that by adding this line up with the rest of the includes: (near the top of your script)
    Simba Code:
    {$i SRL/SRL/misc/paintsmart.scar}
    Note that this is not my procedure, I believe it was BobboHobbo. This is the procedure we'll use to draw an array of text on SMART at a specific point we define using a specific color we define. For those of you who don't know an array of text (TStringArray) is really simple to make. Here's an example:
    Simba Code:
    PrintTexts := ['Hello', 'there', 'my name', 'is Flight'];
    You can see how anything in the array is defined within the "[]" and separated with commas. And because it's text (strings) each text will have (''). Alright, so let's get our procedure.
    Simba Code:
    Procedure PrintOnSmart(TP: TStringArray; Placement: TPoint; Colour: integer);
      var
        mx, my, Pic, I, B, H, TPH, Numb: Integer;
        TTP: TPointArray;
        Canvas: TCanvas;
      begin
        SmartSetDebug(True);
        GetClientDimensions(mx, my);
        Pic := BitmapFromString(mx, my, '');
        TPH := High(TP);
        for I := 0 to TPH do
        begin
          TTP := LoadTextTPA(TP[i], SmallChars, H);
          for B := 0 to High(TTP) do
          begin
            Numb := ((I + 1) * 13);
            FastSetPixel(Pic, TTP[b].x + 1, TTP[b].y + Numb + 1,131072);
            FastSetPixel(Pic, TTP[b].x, TTP[b].y + Numb, Colour);
          end;
        end;
        Canvas := TCANVAS.Create;
        Canvas.Handle := SmartGetDebugDC;
        DrawBitmap(Pic, Canvas, Placement.x, Placement.y);
        FreeBitmap(Pic);
      end;
    The parameters for this procedure is (TStringArray, Placement, Color), very simple, ya? We already know what to put in place for "TP", but what about the other two? Easy peasy. Placement is where the top-left corner of first text will appear. So, to get an accurate coordinate of where you'll want to place your text, what I always do is load up SMART and drag the "Select a client" button (near the top of Simba, looks like a green scope with a target in the middle) over to SMART.

    Now when you hover your mouse over SMART the coords displayed in Simba (bottom left-hand corner) are now accurate. So, move your mouse over SMART where you want to place your text. I chose the point (40, 50):


    Now we just need a color for our text. I simply use Simba's Colour-Picker tool (just left of the 'Select a client' tool) and get a color that way. I picked 255, which is a pure red. So it looks like we have everything we need to start using the procedure, let's do it!


    Step Two: Printing text

    Hopefully you've already thought of what you're gonna print on your SMART canvas. For this tutorial I'm gonna use ['A painted canvas', 'by Flight'], with my placement being Point(40, 50) and my color being 255. So where ever you want your on-screen painting go ahead an use it as such. So here's what my test script is looking like so far:
    Simba Code:
    program PaintStuff;
      {$define SMART}
      {$i srl/srl.scar}
      {$i SRL/SRL/misc/paintsmart.scar}

      Procedure PrintOnSmart(TP: TStringArray; Placement: TPoint; Colour: integer);
      var
        mx, my, Pic, I, B, H, TPH, Numb: Integer;
        TTP: TPointArray;
        Canvas: TCanvas;
      begin
        SmartSetDebug(True);
        GetClientDimensions(mx, my);
        Pic := BitmapFromString(mx, my, '');
        TPH := High(TP);
        for I := 0 to TPH do
        begin
          TTP := LoadTextTPA(TP[i], SmallChars, H);
          for B := 0 to High(TTP) do
          begin
            Numb := ((I + 1) * 13);
            FastSetPixel(Pic, TTP[b].x + 1, TTP[b].y + Numb + 1,8388736);
            FastSetPixel(Pic, TTP[b].x, TTP[b].y + Numb, Colour);
          end;
        end;
        Canvas := TCANVAS.Create;
        Canvas.Handle := SmartGetDebugDC;
        DrawBitmap(Pic, Canvas, Placement.x, Placement.y);
        FreeBitmap(Pic);
      end;

      Procedure DoThePainting;
      begin
        PrintOnSmart(['A painted canvas', 'by Flight'], Point(40, 50), 255);
      end;

    begin
      Smart_Server := 86;
      Smart_Members := True;
      Smart_Signed := True;
      Smart_SuperDetail := False;
      SetupSRL;  //This must be called before any canvas painting

      DoThePainting;

    end.
    Alright, let's run it and see how she turned out.


    Wonderful! Also you're probably asking why the text was written from top to bottom. Well that's how the procedure works, for each independent string (text) you paint, it will appear below the last text. Because I had two strings ("A painted canvas" and "By Flight") I had two lines of text painted on SMART.

    There's no limit to what all you can print on SMART with text. If you've used some of my scripts before you've noticed I use this for the on-screen printing of progress reports and such. But for now, this is a good place to begin and experiment.


    Step Three: Printing images

    Ok this... I'm sure there's a much simpler way of doing so, but this is the way I do it. It's a cheap hack pretty much. What we're gonna do here is modify (butcher) the "PrintOnSmart" procedure. If you've read over the procedure you'll see what it does is draw your text on the screen in the form of a Bitmap. So what we'll do is create our own bitmap (image) to be drawn in the procedure.

    Go ahead and make the image you want to draw in paint, photoshop, whatever, just make sure you save it as Bitmap (.bmp, 24-bit). I'll be using this:


    Alright, let's modify the procedure to make two "Pic"s. I'll make the new modified procedure, assuming we'll be placing our image at (40, 100) (slightly below where our text ends).
    Simba Code:
    Procedure PrintOnSmart(TP: TStringArray; Placement: TPoint; Colour: integer);
      var
        mx, my, Pic, Pic2, I, B, H, TPH, Numb: Integer;  //Add another Pic here (I used Pic2)
        TTP: TPointArray;
        Canvas: TCanvas;
      begin
        SmartSetDebug(True);
        GetClientDimensions(mx, my);
        Pic := BitmapFromString(mx, my, '');
        Pic2 := //Here is where we'll put the BMP info from our image
        TPH := High(TP);
        for I := 0 to TPH do
        begin
          TTP := LoadTextTPA(TP[i], SmallChars, H);
          for B := 0 to High(TTP) do
          begin
            Numb := ((I + 1) * 13);
            FastSetPixel(Pic, TTP[b].x + 1, TTP[b].y + Numb + 1,8388736);
            FastSetPixel(Pic, TTP[b].x, TTP[b].y + Numb, Colour);
          end;
        end;
        Canvas := TCANVAS.Create;
        Canvas.Handle := SmartGetDebugDC;
        DrawBitmap(Pic, Canvas, Placement.x, Placement.y);
        DrawBitmap(Pic2, Canvas, 40, 100);  //The 40 & 100 is the X/Y of where the image will be printed
        FreeBitmap(Pic);
        FreeBitmap(Pic2);
      end;
    Luckily Simba has a tool for converting a Bitmap to a string, which we can use within this procedure. So let's go up to 'Tools > Bitmap conversion' and open the image we want to use. Now just hit the 'To string' button and your image's BMP info will be printed in Simba. Here's mine:
    Simba Code:
    Bmp := BitmapFromString(22, 19, 'meJytk7ENAjEMRVNSsgprsApr3A' +
            'iU11KySsoraRnDZ/Glr499CS6wopPPsV9sx2ntn3K+3ny5cnlasJy' +
            'WrUhwTzgDopYKhP50DpYKRMODvV4LSkAVUFgX9bks/Ss8Q9DbSjj0' +
            'QHCFF5QzzwRClABIJYFDQsjqZwKBoJBDwlweb/Ol3chb9hEq1Hvv6' +
            'pabqQRYTITh+LKE0Ez/hU/fbF1jRZr/aK5AgBtDdDUZp9E8MA0NvL' +
            '+MreYrm8ykb+VLYdTo6Cx8zuGlj2QHxKVFOg==');
    Alright, let's plug that into the procedure:
    Simba Code:
    Procedure PrintOnSmart(TP: TStringArray; Placement: TPoint; Colour: integer);
      var
        mx, my, Pic, Pic2, I, B, H, TPH, Numb: Integer;
        TTP: TPointArray;
        Canvas: TCanvas;
      begin
        SmartSetDebug(True);
        GetClientDimensions(mx, my);
        Pic := BitmapFromString(mx, my, '');
        Pic2 := BitmapFromString(22, 19, 'meJytk7ENAjEMRVNSsgprsApr3A' +
            'iU11KySsoraRnDZ/Glr499CS6wopPPsV9sx2ntn3K+3ny5cnlasJy' +
            'WrUhwTzgDopYKhP50DpYKRMODvV4LSkAVUFgX9bks/Ss8Q9DbSjj0' +
            'QHCFF5QzzwRClABIJYFDQsjqZwKBoJBDwlweb/Ol3chb9hEq1Hvv6' +
            'pabqQRYTITh+LKE0Ez/hU/fbF1jRZr/aK5AgBtDdDUZp9E8MA0NvL' +
            '+MreYrm8ykb+VLYdTo6Cx8zuGlj2QHxKVFOg==');
        TPH := High(TP);
        for I := 0 to TPH do
        begin
          TTP := LoadTextTPA(TP[i], SmallChars, H);
          for B := 0 to High(TTP) do
          begin
            Numb := ((I + 1) * 13);
            FastSetPixel(Pic, TTP[b].x + 1, TTP[b].y + Numb + 1,8388736);
            FastSetPixel(Pic, TTP[b].x, TTP[b].y + Numb, Colour);
          end;
        end;
        Canvas := TCANVAS.Create;
        Canvas.Handle := SmartGetDebugDC;
        DrawBitmap(Pic, Canvas, Placement.x, Placement.y);
        DrawBitmap(Pic2, Canvas, 40, 100);
        FreeBitmap(Pic);
        FreeBitmap(Pic2);
      end;
    Now let's run it and see what happens.


    Yaya, success!

    So this concludes the super simple SMART painting tutorial. Like I mentioned before this is just how I do it personally, you're in no way limited to using my methods. So be creative, play around with this and see what you can come up with. If you've any questions ask away.

    ~Cheerz

    Current projects:
    [ AeroGuardians (GotR minigame), Motherlode Miner, Blast furnace ]

    "I won't fall in your gravity. Open your eyes,
    you're the Earth and I'm the sky..."


  2. #2
    Join Date
    Feb 2006
    Location
    Tracy/Davis, California
    Posts
    12,631
    Mentioned
    135 Post(s)
    Quoted
    418 Post(s)

    Default

    Wonderful.
    Plan on adding an option for this for all of my scripts in the future and was going to look at yours as an example, a tutorial is even better! Awesome job Flight!

    You ever look through this thread?
    http://villavu.com/forum/showthread.php?t=56774
    Any idea how to make more complex looking stuff like that?
    (Not the mouseover portion, but just how the painting is not just text but a pretty looking thing, is that the same as how you did the Garfield bitmap?)

  3. #3
    Join Date
    Aug 2007
    Location
    Colorado
    Posts
    7,421
    Mentioned
    268 Post(s)
    Quoted
    1442 Post(s)

    Default

    Quote Originally Posted by YoHoJo View Post
    Wonderful.
    Plan on adding an option for this for all of my scripts in the future and was going to look at yours as an example, a tutorial is even better! Awesome job Flight!

    You ever look through this thread?
    http://villavu.com/forum/showthread.php?t=56774
    Any idea how to make more complex looking stuff like that?
    (Not the mouseover portion, but just how the painting is not just text but a pretty looking thing, is that the same as how you did the Garfield bitmap?)
    I would image so. I'm quite new to canvases and what not. I think if anyone would have a good idea on that it's Mormonman. I'd love to play around with them in the future, no doubt!

    Current projects:
    [ AeroGuardians (GotR minigame), Motherlode Miner, Blast furnace ]

    "I won't fall in your gravity. Open your eyes,
    you're the Earth and I'm the sky..."


  4. #4
    Join Date
    Jan 2011
    Posts
    350
    Mentioned
    0 Post(s)
    Quoted
    2 Post(s)

    Default

    awesome great tut

  5. #5
    Join Date
    Oct 2011
    Location
    Chicago
    Posts
    3,352
    Mentioned
    21 Post(s)
    Quoted
    437 Post(s)

    Default

    Thank you so much for releasing this I just really liked the paints on your scripts so I thought id learn from the best :P




    Anti-Leech Movement Prevent Leeching Spread the word
    Insanity 60 Days (Killer workout)
    XoL Blog (Workouts/RS/Misc)

  6. #6
    Join Date
    Oct 2008
    Location
    C:\Simba\Includes\
    Posts
    7,566
    Mentioned
    19 Post(s)
    Quoted
    180 Post(s)

    Default

    Awesome tut, bookmarked for later
    Away for awhile, life is keeping me busy. | Want to get my attention in a thread? @Kyle Undefined; me.
    { MSI Phoenix || SRL Stats Sigs || Paste || Scripts || Quotes || Graphics }

    When posting a bug, please post debug! Help us, help you!

    I would love to change the world, but they won't give me the source code. || To be the best, you've got to beat the rest. || Logic never changes, just the syntax.
    If you PM me with a stupid question or one listed in FAQ, or about a script that is not mine, I will NOT respond.


    SRL is a Library of routines made by the SRL community written for the Program Simba. We produce Scripts for the game Runescape.


  7. #7
    Join Date
    Jan 2007
    Posts
    8,876
    Mentioned
    123 Post(s)
    Quoted
    327 Post(s)

    Default

    Nice tutorial Flight

    I committed some functions to smart.simba yesterday making one able to get the real mouse position, You could incorporate that in this tutorial making a section like "When the user hovers this, paint this"

  8. #8
    Join Date
    Jul 2008
    Posts
    136
    Mentioned
    0 Post(s)
    Quoted
    0 Post(s)

    Default

    Kewl man ..

  9. #9
    Join Date
    Sep 2008
    Location
    Not here.
    Posts
    5,422
    Mentioned
    13 Post(s)
    Quoted
    242 Post(s)

    Default

    A big issue with creating an interactive paint is that we can't use multi-threading(or a mouseListener). The only thing I can think of where it is readily-applicable is an onscreen gui, which would take more work than its worth and a form is smarter anyways. You could weave the paint in with the script but it would take speed away from the script and make the script a jumbled mess. I was playing with it earlier and I just hated the limitations that scripts have, speed/power/etc.
    On a less annoyed note, I might develop some sort of paint-gui include but I'm completely undecided at this point.

  10. #10
    Join Date
    Aug 2007
    Location
    Colorado
    Posts
    7,421
    Mentioned
    268 Post(s)
    Quoted
    1442 Post(s)

    Default

    Quote Originally Posted by mormonman View Post
    A big issue with creating an interactive paint is that we can't use multi-threading(or a mouseListener). The only thing I can think of where it is readily-applicable is an onscreen gui, which would take more work than its worth and a form is smarter anyways. You could weave the paint in with the script but it would take speed away from the script and make the script a jumbled mess. I was playing with it earlier and I just hated the limitations that scripts have, speed/power/etc.
    On a less annoyed note, I might develop some sort of paint-gui include but I'm completely undecided at this point.
    That's exactly what I was thinking before. Multi-threading was the term I was looking for. I might have been able to just wing everything else, but having a constant mouselistener is something I have no idea how to do.

    Forms, I've tried those before and failed...

    @Zyt3x:
    Thank you Yeah I think that would be fairly simple to accomplish but like what Mormonman was talking about is using multi-threading or a mouselistener is what's needed for such results, and my knowledge doesn't extend that far. I was hoping between you and Mormonman something might emerge.

    Current projects:
    [ AeroGuardians (GotR minigame), Motherlode Miner, Blast furnace ]

    "I won't fall in your gravity. Open your eyes,
    you're the Earth and I'm the sky..."


  11. #11
    Join Date
    Apr 2008
    Location
    Marquette, MI
    Posts
    15,252
    Mentioned
    138 Post(s)
    Quoted
    680 Post(s)

    Default

    Looks nice, Flight, although there is a function in paintsmart.scar that draws text to the SMART canvas (SMART_DrawText/Ex). I'm going to edit it so it adds a shadow, and I think I'll add a SMART_DrawTextArray to paintsmart.scar so it'll work just like the function in the OP.

  12. #12
    Join Date
    Sep 2007
    Location
    British Columbia, Canada
    Posts
    4,047
    Mentioned
    1 Post(s)
    Quoted
    2 Post(s)

    Default

    Yayayay i love pyou!!@#!@#@!
    Oh Hai Dar

  13. #13
    Join Date
    Sep 2008
    Location
    Not here.
    Posts
    5,422
    Mentioned
    13 Post(s)
    Quoted
    242 Post(s)

    Default

    Quote Originally Posted by Coh3n View Post
    Looks nice, Flight, although there is a function in paintsmart.scar that draws text to the SMART canvas (SMART_DrawText/Ex). I'm going to edit it so it adds a shadow, and I think I'll add a SMART_DrawTextArray to paintsmart.scar so it'll work just like the function in the OP.
    Go ahead and add all the functions in my other thread please. thanks.

  14. #14
    Join Date
    Apr 2008
    Location
    Marquette, MI
    Posts
    15,252
    Mentioned
    138 Post(s)
    Quoted
    680 Post(s)

    Default

    Quote Originally Posted by mormonman View Post
    Go ahead and add all the functions in my other thread please. thanks.
    I planned on it, don't worry.

  15. #15
    Join Date
    Sep 2008
    Location
    Not here.
    Posts
    5,422
    Mentioned
    13 Post(s)
    Quoted
    242 Post(s)

    Default

    Quote Originally Posted by Coh3n View Post
    I planned on it, don't worry.
    We might need to redo some of the functions...I'm gonna run some tests to find the fastest methods.

  16. #16
    Join Date
    Oct 2011
    Location
    UK
    Posts
    1,322
    Mentioned
    2 Post(s)
    Quoted
    1 Post(s)

    Default

    We should get PrintOnSmart included in the paintsmart.simba file so nooby scripters could use it with very little effort

  17. #17
    Join Date
    Oct 2011
    Posts
    192
    Mentioned
    0 Post(s)
    Quoted
    17 Post(s)

    Default

    Awesome, I'll come back to this when I get around to creating a paint for my script

    Thanks!

  18. #18
    Join Date
    Dec 2011
    Location
    Cincinnati/Columbus, Ohio
    Posts
    1
    Mentioned
    0 Post(s)
    Quoted
    0 Post(s)

    Default

    thanks for this great tutorial. This is gonna help me on my way to becoming a great scripter

  19. #19
    Join Date
    Oct 2011
    Posts
    62
    Mentioned
    0 Post(s)
    Quoted
    0 Post(s)

    Default

    it is possible to make simba run two seperate loops?

    eg one for the paint to provide real time stats and the other to run the script.

    or is that what multi-threading is?

    brilliant TUT by the way ....what does TUT stand for anyway >.<

  20. #20
    Join Date
    May 2007
    Location
    Waterloo, Ontario, Canada
    Posts
    1,008
    Mentioned
    1 Post(s)
    Quoted
    0 Post(s)

    Default

    Quote Originally Posted by logical View Post
    it is possible to make simba run two seperate loops?

    eg one for the paint to provide real time stats and the other to run the script.

    or is that what multi-threading is?

    brilliant TUT by the way ....what does TUT stand for anyway >.<
    TUT -> Tutorial.

    Yes it is possible for simba to run two loops, may start hogging your memory though(not really sure). You can design a script to have a procedure of a mainloop, and a function which is looping to fix up the paint on the smart canvas.

  21. #21
    Join Date
    Oct 2011
    Posts
    62
    Mentioned
    0 Post(s)
    Quoted
    0 Post(s)

    Default

    Oo...thx Toxin

    But could i have an example?...I'm just a bit curious.

  22. #22
    Join Date
    Jun 2008
    Location
    United States
    Posts
    818
    Mentioned
    60 Post(s)
    Quoted
    90 Post(s)

    Default

    Quote Originally Posted by Coh3n View Post
    I planned on it, don't worry.
    Coh3n, when I stumbled upon the procedure used in this tutorial a few months ago, I noticed that it doesn't flicker when you redraw, unlike the text painting in paintsmart. Not to mention, you can use any color you want with this. Is there a particular reason why working on a bitmap and then drawing that to SMART is faster?
    [10/14/13:19:03] <BenLand100> this is special relatively, just cleverly disguised with yachts

  23. #23
    Join Date
    Sep 2008
    Location
    Not here.
    Posts
    5,422
    Mentioned
    13 Post(s)
    Quoted
    242 Post(s)

    Default

    Quote Originally Posted by euphemism View Post
    Coh3n, when I stumbled upon the procedure used in this tutorial a few months ago, I noticed that it doesn't flicker when you redraw, unlike the text painting in paintsmart. Not to mention, you can use any color you want with this. Is there a particular reason why working on a bitmap and then drawing that to SMART is faster?
    The flickering is caused by each point being drawn to the canvas during the function, with un-precompiled code. Drawing a bitmap to a canvas is faster because it is precompiled.

  24. #24
    Join Date
    Apr 2008
    Location
    Marquette, MI
    Posts
    15,252
    Mentioned
    138 Post(s)
    Quoted
    680 Post(s)

    Default

    Quote Originally Posted by euphemism View Post
    Coh3n, when I stumbled upon the procedure used in this tutorial a few months ago, I noticed that it doesn't flicker when you redraw, unlike the text painting in paintsmart. Not to mention, you can use any color you want with this. Is there a particular reason why working on a bitmap and then drawing that to SMART is faster?
    I didn't know there was any kind of flickering with paintsmart.scar. I've only ever used it with MSI for debugging, never for progress reports.

    Quote Originally Posted by mormonman View Post
    The flickering is caused by each point being drawn to the canvas during the function, with un-precompiled code. Drawing a bitmap to a canvas is faster because it is precompiled.
    If the method in the first post is faster and doesn't flicker, maybe it's better to rewrite paintsmart.scar to use that method? I'm not sure how much I like creating/freeing a bitmap each time the function is called. Seems inefficient if it's called often.

  25. #25
    Join Date
    Feb 2009
    Location
    inside Hello World! Application
    Posts
    232
    Mentioned
    0 Post(s)
    Quoted
    8 Post(s)

    Default

    Would it Paint progress reports? :P cuz that'd be cool ^^

Page 1 of 2 12 LastLast

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •