Monday, December 5, 2016

Reflection of class on Dec 1st
  Well, this chapter 6 is the last one that teach us how to promote our drawing application by attaching interesting functions to dedicated buttons and mouse movement, that is, like the basic pre-installed drawing tool in Windows system, we can make an image stamp to the canvas and use mouse to draw an image directly.
  It’s not easy to do that, the first problem I met was that I couldn’t place the image to the location of mouse clicking when I run the complete procedure after coding as examples in chapter, the image would automatically appear at the middle of bottom of canvas when I clicked image buttons. I knew I need to change the ‘x_coord’ and ‘y_coord’ in ‘canvas.create_image’ statement which reflected to the current coordinate of cursor when I hit the arrow keys to draw lines, but I really didn’t know how to adjust it to my thought to make it run well as the real stamping tool which could stamp images to anywhere I wonder on canvas.
  And the second problem was that I couldn’t understand the meaning of binding statement which attached relative function to mouse movement. What did the ‘<B1-Motion>’ and ‘<Button-1>’ use for? When should I add ‘event’ argument to ‘paint’ function and how to decided it?
  Though I could control the placement of image by using arrow keys to position it with the pen in the up position inspired by challenge 1, it would be a real hard work to place each image to the appointed position by hit arrow keys frequently.
  Actually, the complete procedure showed in this chapter is not a perfect program to achieve the function of stamping and mouse drawing, I want to find a better way to update it by implementing the idea of C programming in but get no reward. I’ll do it continually.


Wednesday, November 30, 2016

Reflection of class on Nov 29th
  At the beginning of this chapter 5, there is a similar interface of drawing app which I have created in last class, but the difference is that a line of various buttons is added below the bottom of the original surface. So what are these buttons used for?
  As the basic instructions of this chapter says, these buttons can change the line color and line thickness by attaching functions to them instead of key presses, and the size of these buttons can be adjusted easily as well. So how to do that?
  In order to save time, I downloaded the source code from the dedicated coding website and copied them to the new text editing interface, what I need to do is adding relative codes to the preset blanks which were highlighted by red color and run the whole procedure to see what will happen on the app canvas. Absolutely, I need try to change some codes to customize my own app canvas.
  I defined some new functions about line colors and bind them with relative keys by implementing ‘window.bind’ statement just like the last chapter. Then, following to the steps of the example, I added buttons to my application by typing codes of loading images for buttons and attached functions which include necessary variables to buttons.
  I didn’t understand completely why I need to remove ‘event’ from between the brackets of pen color functions so that the procedure could work normally, but I found that I couldn’t change the pen color by pressing preset keys anymore when I run the program. Actually, I found the solution for this item from the later content of this chapter, all I need to do was removing these useless codes from the procedure because their functions were already replaced by codes of buttons. Well, I got a feel suddenly that the author was a fantastic magician who could read my mind and predict my behavior. Just for fun.
  At last, I did the same operation as color button to plus and minus button to change line size and try to change the value of side from LEFT to RIGHT of ‘Button’ function to see what could be changed when I run it as the idea 1 said. Well, all things are correct except the position of buttons. These buttons were arranged from the right side of the bottom of the canvas. What’s more, I added another button to choose a random color which I preset before by implementing random import and ‘random.randint’ command.
  All is well! Now I can draw more fabulous images by my new drawing application!

  

Monday, November 28, 2016

Reflection of class on Nov 17th
  I have learnt about how to create colorful and fabulous images which are usually combined by loops of various regular shapes and lines by implementing Python’s turtle module, and I can also let the little title write down my Chinese name by typing relative codes in text editing interface. The turtle module is not interactive which means that I cannot control it when I run it, just wait for the result.
  But now, I can set and customize my own canvas by tkinter module and draw some personal images by creating various red lines which can be controlled by pressing ‘up’ ‘back’ ‘left’ and ‘right’ keys.
  At first, I should set necessary variables like height, width and color for my own canvas by following the example of this chapter 4. Then, I need to edit the corresponding function to move red lines. It’s not difficult to understand relative codes showed in the example, but I met a problem that I did not know where was the original point of canvas and the correct direction of ‘y’ coordinate. Fortunately, I figured it out by changing different position of anchor. As you know, I need to press different direction keys to control the creating of red lines so it’s important to connect these keys with dedicated functions that they can be called successfully. And, the ‘window.bind’ statement works perfectly here.
  As I can see, the background of my own canvas is black and it looks not so good to me so that I want to change it to my favorite picture just like changing the background of my computer, that is, I can use ‘PhotoImage’ statement to do this but I need ensure that the format of picture I want to implement should be gif, not jpg or jpeg. What’s more, I need to add ‘anchor=NW’ at the end of ‘canvas.create_image’ statement inside to make sure the new background I added could cover the canvas completely.

  In the rest of this chapter, I learned how to lift and lower and keep track of the pen, the concept here is similar with turtle module so I could understand and implement them in my own drawing app. And I found a useful way inspired by the challenge 3 of this chapter to cancel the last line what I have created by adding ‘erase(current_line)’ statement. It works much better than the ‘erase_all()’ statement.