Button with image?

Get help with using AutoHotkey (v1.1 and older) and its commands and hotkeys
User avatar
empardopo
Posts: 336
Joined: 06 Oct 2013, 12:50
Location: Spain
Contact:

Button with image?

28 Oct 2013, 08:38

I want to do a game for my children! They are learning to read.

I want show some cards with letter on the screen. The program will talk, asking them press the correct letter.
In the cards, it must appear a drawing.

What do you advise me to use? Can they put a background image to buttons?

Thanks in advance!
Everything is possible!
User avatar
Blackholyman
Posts: 1293
Joined: 29 Sep 2013, 22:57
Location: Denmark
Contact:

Re: Button with image?

28 Oct 2013, 08:52

You Can use an image control with a g-label
Also check out:
Courses on AutoHotkey

My Autohotkey Blog
:dance:
User avatar
PuzzledGreatly
Posts: 1320
Joined: 29 Sep 2013, 22:18

Re: Button with image?

28 Oct 2013, 09:11

This is the kind of thing I am working on as well. Are you going to use a phonetic approach - eg c and k have the same sound? In my experience that is more helpful for reading. Instead of a picture you can also use text with a g-label. The problem with text is that fonts are different sizes on different monitors. I wish I knew a solution to that.
User avatar
empardopo
Posts: 336
Joined: 06 Oct 2013, 12:50
Location: Spain
Contact:

Re: Button with image?

28 Oct 2013, 09:23

At this moment I only need that my children start to recognize the letters. :D
I want to use simple sounds for each letter.
I'll comment.

Thanks!
Everything is possible!
kidbit
Posts: 168
Joined: 02 Oct 2013, 16:05

Re: Button with image?

28 Oct 2013, 10:39

OffTopic:
Spoiler
Last edited by kidbit on 28 Oct 2013, 11:51, edited 1 time in total.
question := (2b) || !(2b) © Shakespeare.
User avatar
empardopo
Posts: 336
Joined: 06 Oct 2013, 12:50
Location: Spain
Contact:

Re: Button with image?

28 Oct 2013, 11:10

I'm sorry but I get an error with your script
C:\Archivos de programa\Sublime Text 3\Avis_Sublime4Autohotkey\temp\default9.ahk (22) : ==> This parameter contains a variable name missing its ending percent sign.
Specifically: %Name%, % "how much will this be:
" operand1 operator1 operand2 operator2 operand3 operator3 operand4 operator4 operand5 operator5 operand6 operator6 operand7 " = ?"
[Finished in 0.1s]
Any help with Gui,Add Picture ?
I have any jpg files and I need to place them in a certain position. What is the correct sintaxis for Gui,Add,Picture?
Thanks in advance!
Everything is possible!
kidbit
Posts: 168
Joined: 02 Oct 2013, 16:05

Re: Button with image?

28 Oct 2013, 11:52

empadopo, I edited the code. That line should be InputBox, answer, Task [%A_Index%/%numberOfTasks%], % Name ", how much will this be:`n" operand1 operator1 operand2 operator2 operand3 operator3 operand4 operator4 operand5 operator5 operand6 operator6 operand7 " = ?"
question := (2b) || !(2b) © Shakespeare.
Alibaba
Posts: 480
Joined: 29 Sep 2013, 16:15
Location: Germany

Re: Button with image?

28 Oct 2013, 12:43

empardopo wrote:Any help with Gui,Add Picture ?
I have any jpg files and I need to place them in a certain position. What is the correct sintaxis for Gui,Add,Picture?
Thanks in advance!
GUI, Add, Picture, xn yn glabel, path to picture

Replace the "n"'s with the coordinates and label with the name of the label you want to jump to, if the image gets clicked.
"Nothing is quieter than a loaded gun." - Heinrich Heine
User avatar
empardopo
Posts: 336
Joined: 06 Oct 2013, 12:50
Location: Spain
Contact:

Re: Button with image?

28 Oct 2013, 12:45

kidbit, now it works fine. I will study the code. :D

I have this

Image

How can I lay the letter B on the right of the letter A?

My code is this:

Code: Select all

Gui, Show, w800 h600
Gui, Add, Picture, 0 0 w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\A.png-1.jpg
Gui, Add, Picture, xm w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\B.png-1.jpg
Gui, Add, Picture, w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\C.png-1.jpg
Gui, Add, Picture, w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\D.png-1.jpg

return
Thanks!
Everything is possible!
User avatar
empardopo
Posts: 336
Joined: 06 Oct 2013, 12:50
Location: Spain
Contact:

Re: Button with image?

28 Oct 2013, 12:49

Alibaba wrote:
empardopo wrote:Any help with Gui,Add Picture ?
I have any jpg files and I need to place them in a certain position. What is the correct sintaxis for Gui,Add,Picture?
Thanks in advance!
GUI, Add, Picture, xn yn glabel, path to picture

Replace the "n"'s with the coordinates and label with the name of the label you want to jump to, if the image gets clicked.
WoW!!! Thanks very much!

Now, It works fine
Image

Thanks!
Everything is possible!
kidbit
Posts: 168
Joined: 02 Oct 2013, 16:05

Re: Button with image?

28 Oct 2013, 13:25

or you could use the relative coordinates:

Code: Select all

Gui, Add, Picture, 0 0 w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\A.png-1.jpg
Gui, Add, Picture, x+1 w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\B.png-1.jpg
Gui, Add, Picture, x+1 w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\C.png-1.jpg
Gui, Add, Picture, x+1 w100 h-1 gletraA, C:\Documents and Settings\Administrador\Escritorio\Letras\D.png-1.jpg
question := (2b) || !(2b) © Shakespeare.
Alibaba
Posts: 480
Joined: 29 Sep 2013, 16:15
Location: Germany

Re: Button with image?

28 Oct 2013, 17:18

kidbit wrote:or you could use the relative coordinates
Yes. In case that all pictures have the same size, this is the better way.

To jump to the "next line" with relative coords, simply reset x to 0 and use y+1.
"Nothing is quieter than a loaded gun." - Heinrich Heine
User avatar
empardopo
Posts: 336
Joined: 06 Oct 2013, 12:50
Location: Spain
Contact:

Re: Button with image?

28 Oct 2013, 18:21

It looks easier using relative coordinates. Thanks!
Everything is possible!
User avatar
PuzzledGreatly
Posts: 1320
Joined: 29 Sep 2013, 22:18

Re: Button with image?

28 Oct 2013, 19:02

Your graphics look nice but for learning to read (and write) lower case is more useful than upper case. Having said that, one method is to use the upper case for the letter names (as in the ABC song) and the lower case for the sounds. Then introduce the idea of Letter A says "a", letter "B" says "b" etc. However, I prefer introducing the lower case first with the letter sounds (phonemes) and only bother with the upper case once reading has started. I work with children learning English as a second language. In my experience those who have the ABC ingrained have a much harder time learning to read than those who don't. Eg the word cat is not pronounced SEE-AY-TEE. Check out Synthetic phonics at Wikipedia .

Back to AHK - here is a rough function I've been using to centre a graphic after it has been touched:

Code: Select all

MoveToCentre(img, siz, speed, GN=1)
{
	;img = variable associated with the control to be moved
	;siz - final size eg 2 will double the size, 0.5 will halve it
	;speed - the larger the number the slower the movement
	;GN = the Gui Number for cases with more than one Gui

	Gui, %GN%:default
	
	GuiControlGet, %img%, Pos
	
	sizW := %img%W * siz
	sizH := %img%H * siz
	
	offX := (A_ScreenWidth/2) - (sizW/2)
	offY := (A_ScreenHeight/2) - (sizH/2)

	shiftW := (sizW - %img%W) / speed
	shiftH := (sizH - %img%H) / speed
	
	speedX := (offX - %img%X) / speed
	speedY := (offY - %img%Y) / speed

	moveX := %img%X + speedX
	moveY := %img%Y + speedY	

	sizeW := %img%W + shiftW
	sizeH := %img%H + shiftH		
	
	loopN := speed - 1
	
	loop, %loopN%
	{
		GuiControl, %GN%:movedraw, %img%, x%moveX% y%moveY% w%sizeW% h%sizeH%
		moveX += speedX
		moveY += speedY
		sizeW += shiftW
		sizeH += shiftH
		sleep 10
	}	
	
	GuiControl, %GN%:movedraw, %img%, x%offX% y%offY% w%sizW% h%sizH%
}
I use GuiControl to hide the other images on the screen. Some movement makes an activity more attractive to children.

Return to “Ask for Help (v1)”

Who is online

Users browsing this forum: AlFlo, Bing [Bot] and 145 guests