Ver la Versión Completa : ¿Cómo hacer un puzzle sencillo para niños?
Hola a todos. Me gustaría indicarais un ejemplo sencillo (seguro que hay algo por ahí) de cómo hacer un puzzle con una imagen troceada. Digamos a un lado de la pantalla una trama y a la derecha una serie de piezas o componentes TImage que se tienen que llevar a la trama. En fin lo más sencillo posible. Digamos seis piezas, por dar un número. Gracias.
nlsgarcia
21-11-2012, 21:50:20
bulc,
Revisa este link:
15 Puzzle Game with Delphi Source Code : http://delphi.about.com/od/gameprogramming/a/puzzle15.htm
En el encontraras un ejemplo descargable de un Puzzle hecho en Delphi.
Espero sea útil :)
Nelson.
Neftali [Germán.Estévez]
22-11-2012, 10:11:37
Algunos links que te pueden ayudar...
Cómo trocear una imagen en trozos a modo de puzzle (http://neftali.clubdelphi.com/?p=174).
Una vez troceada debes poder moverlas utilizando el ratón. Aquí hay un ejemplo de cómo puedes mover componentes de tipo TImage utilizando el ratón (http://neftali.clubdelphi.com/?p=121) (y aquí otro sobre lo mismo (http://neftali.clubdelphi.com/?p=87)).
Por último sólo queda la parte de "saber" cuando el puzzle está acabado y correcto. deberías tener una zona donde las imágenes que se mueven queden ancladas. Es decir en un puzzle de 2x3, deberías tener definido una "especie" de tablero, donde puedas conocer qué pieza se ha movido a cada posición y poder comprobar si cada una está en la posición correcta.
Espero que te haya servido de ayuda.
Un saludo.
Me pongo a ello. Gracias.
roman
22-11-2012, 19:33:23
Cómo trocear una imagen en trozos a modo de puzzle (http://neftali.clubdelphi.com/?p=174).
¿Y para trocearlos así?
http://static.freepik.com/foto-gratis/interminable-pieza-del-rompecabezas-de-rompecabezas_17-305202242.jpg
:D
Edito:
¡Epa! ¡Qué trozote! :eek: Pero se entiende la pregunta ¿no? :D
// Saludos
Vaya recochineo... !!Je, je!! Pero si no sé ni hacer una o con un canuto!
movorack
22-11-2012, 22:28:50
Se que delphi es un lenguaje multiproposito pero esto no sería mucho mas sencillo no se en Flash o hasta en HTML5 y creo que de eso si que abundan ejemplos y hasta mas sencillo ha de ser.
Como ejemplo solo escribes "Flash create puzzle game" y te devuelve 77 millones de resultados... entre otros este (http://www.ehow.com/how_6190208_make-puzzle-games-flash.html).
En cambio si escribes "Delphi Creatre puzzle game" solo te devuelve 12 millones de resultados y de verdad que no hay tantos tutoriales "For dummies".
Esto lo digo por: Vaya recochineo... !!Je, je!! Pero si no sé ni hacer una o con un canuto!
Neftali [Germán.Estévez]
23-11-2012, 11:04:32
¿Y para trocearlos así?
http://img839.imageshack.us/img839/2381/interminablepiezadelrom.jpg
Ufff!!!!!
Podemos intentar avanzar un poco más.
Para el tema de la interficie, que es lo primero que se me ha venido a la cabeza, supongo que un opción sería utilizar forms con máscaras. Hay alguna utilidad que permite facilitar esto. Si pensamos en un puzzle con las piezas interiores iguales, habría que generar 9 máscaras (4 esquinas, 4 laterales y 1 interior).
Algo así:
http://img819.imageshack.us/img819/1258/imagen145.png
(link al ejemplo en el FTP (http://terawiki.clubdelphi.com/Delphi/Ejemplos/?download=Puzzle_test.zip))
En el tema de la imagen que comentas Román, no se si se puede hacer utilizando algún tipo de máscaras.
Pienso en un puzzle de este tipo, en que las piezas interiores son iguales (2 o tres tipos)
http://img696.imageshack.us/img696/2250/14636008puzzledefondopl.jpg
Tal vez alguien más ducho en tema de gráficos nos pueda ayudar aquí. Creo que a partir de una plantilla de este tipo, o utilizando unas máscaras similares a las que se usan en el ejemplo para los forms, se debe poder "extraer" de una imagen grandes los trozos que conforman el puzzle.
El último punto complejo, imagino que sería, el detectar que las piezas están colocadas correctamente. Para eso no se si se podría utilizar una plantilla en el formulario que además de hacer de guía, sirviera para ajustar las piezas a sus posiciones correctas (igual que hay controles que llamamos "magnet" que ajustan las ventanas a los bordes, algo similar con las piezas a sus posiciones correctas cuando están cerca).
http://img141.imageshack.us/img141/4492/imagen146b.png
a ver si alguien puede aportar más sobre el tema de las imágenes, me parece interesante.
Un saludo.
Yo creo q para mi nivel lo podríamos dejar en trozos rectangulares. Luego se puede ampliar a formas curvas.
Supongo que cada pieza deberá colocarse según el área donde el ratón haga OnMouseUp. ¿Es así?
¿Debe definirse el área de destino con relación al TForm, o cambia si el TForm se altera de tamaño?
Eso es todo.
Saludos.
Neftali [Germán.Estévez]
23-11-2012, 13:41:30
Yo creo q para mi nivel lo podríamos dejar en trozos rectangulares. Luego se puede ampliar a formas curvas.
Correcto; No estaba pensando en que lo implementaras, si no es necesario, simplemente era por ampliar la información y por probar. Ya sabes, como cuando empiezas un puzzle que es un reto acabarlo, pues algo así... Es el gusanillo que todos tenemos de resolver problemas... ;)
Supongo que cada pieza deberá colocarse según el área donde el ratón haga OnMouseUp. ¿Es así?
¿Debe definirse el área de destino con relación al TForm, o cambia si el TForm se altera de tamaño?
Eso es todo.
Si, entiendo que de alguna forma debes definir una zona donde se van a colocar las piezas "con lo lugares disponibles" y almacenar de alguna manera qué pieza del puzzle va en cada uno de esos "lugares".
Entiendo que el TForm, deberá ser del mismo tamaño que la imagen original (deberías bloquear para que no cambie), de esa forma cuadrarán la piezas dentro del form (en cuanto a tamaño).
Neftali [Germán.Estévez]
23-11-2012, 13:42:23
Más gente al paro.
No lo creo. Yo tengo en la mesa del comedor ahora, uno de 3000 piezas...
Dudo que pudiera hacerlo en la pantalla... :D:D:D:D
Una preguntita. ¿Cómo se impide que el ratón salga del TForm llevándose la notita-cursor del proceso Drag&Drop?
Los enanos alumnos, se llevan la letra fuera (al escritorio windows) y la pierden, lo mismo que pierde la paciencia su profe.
Lo dicho... Gracias.
ecfisa
23-11-2012, 23:42:16
Una preguntita. ¿Cómo se impide que el ratón salga del TForm llevándose la notita-cursor del proceso Drag&Drop?
Los enanos alumnos, se llevan la letra fuera (al escritorio windows) y la pierden, lo mismo que pierde la paciencia su profe.
Lo dicho... Gracias.
Hola bulc.
procedure TForm1.FormActivate(Sender: TObject);
var
R: TRect;
begin
R:= GetClientRect;
MapWindowPoints(Handle,0,R,2);
ClipCursor(@R);
end;
// Necesario para salir de la aplicación
procedure TForm1.btnSalirClick(Sender: TObject);
begin
Close
end;
Saludos. :)
nlsgarcia
24-11-2012, 00:40:35
bulc,
// Necesario para salir de la aplicación
Revisa este código:
procedure TForm1.RemoveClippingStateClick(Sender: TObject);
begin
ClipCursor(nil);
end;
El código anterior devuelve la funcionalidad normal al cursor (Remueve el Clipping State).
También puedes salir de la aplicación con la secuencia de teclas ALT+F4.
Espero sea útil :)
Nelson.
ecfisa
24-11-2012, 01:01:09
bulc,
Revisa este código:
procedure TForm1.RemoveClippingStateClick(Sender: TObject);
begin
ClipCursor(nil);
end;
Hola Nelson.
Supongo que bulc no desea que los niños tengan un botón para desactivar la restricción del mouse y así poder llevar letras al escritorio... :)
Saludos.
nlsgarcia
24-11-2012, 01:15:19
ecfisa,
Supongo que bulc no desea que los niños tengan un botón para desactivar la restricción del mouse y así poder llevar letras al escritorio...
Es solo información complementaria, quizás la aplicación tenga más de un formulario :)
Nelson.
Hola bulc.
procedure TForm1.FormActivate(Sender: TObject);
var
R: TRect;
begin
R:= GetClientRect;
MapWindowPoints(Handle,0,R,2);
ClipCursor(@R);
end;
// Necesario para salir de la aplicación
procedure TForm1.btnSalirClick(Sender: TObject);
begin
Close
end;
Saludos. :)
Gracias, enseguida lo pongo en práctica.
En una aplicación escolar Multificha (20 Forms) de poner letras de animales, tengo un Form de Entrada Principal desde la que se elige un animal. Resulta que una de ellas (la abeja rebelde)
la añado usando Project->Add to Project y cuando se ejecuta la aplicación la abeja se abre encima de la ficha principal. He revisado con Project->Options que la MainForm fuera la correcta
y señala, efectivamente la misma (MainForm1). ¿Alguien me puede dar alguna pista de por qué la dichosa Abeja se cuela?
Por otro lado si se coge una letra (Drag) de la ABEJA, y se la saca a pasear por el escritorio y si suelta el botón... !adiós letra! Y los alumnos encantados, de salir... de donde sea.
Qué cosas. Éstas no las explican ni en el libro gordo ese...
Agradecería una ayudita. Gracias.
Al González
25-11-2012, 20:32:36
Me gustaría ayudarte, pero no hablo alemán. :(
Casimiro Notevi
25-11-2012, 21:48:42
...
Por favor, pon títulos descriptivos a tus preguntas, gracias por tu colaboración.
Ya lo comenté la anterior vez, que hiciste lo mismo, por favor, respeta las normas (http://www.clubdelphi.com/foros/guiaestilo.php) de los foros, gracias :)
Casimiro Notevi
27-11-2012, 19:37:05
Gracias por tu comprensión ^\||/
gatosoft
27-11-2012, 19:50:55
¿Tu aplicación es MDI?, ¿Tus formularios se crean en tiempo de ejecución? (¿incluido el formulario abeja?) Options
Por otro lado si se coge una letra (Drag) de la ABEJA, y se la saca a pasear por el escritorio y si suelta el botón... !adiós letra!
¿Y cual es la funcionalidad correcta? estas habilitando Drag and Drop para las letras de la palabra, ¿para que?, ¿para que la lleven a un panel?, ¿para que la saquen de la pantalla?...
Comparto un poco la respuesta de Al
Me gustaría ayudarte, pero no hablo alemán.
Dices mucho pero... faltan detalles, no podemos ayudarte adivinando tu código.... ¿puedes poner ejemplos mas concretos?
El objetivo de esta aplicación escolar es llevar letras TLabel para formar la palabra del animal que se muestras en un TImage. Debajo hay otro TImage de fondo tapado con otros TImages de Tapa.
Al dejar el TLabel que se arrastra, aparece la letra, etc...
No es MDI, es una aplicación multificha normal. Carga 20 ventanas=fichas al iniciarse. El objeto es llevar letras (TLabel) grandes a unas TImages. Al hacer Drop en la Imagen, aparece una letra, etc. (Se entiende?)
Los alumnos llevan el TLabel (Cursor de Drag), pero algunos "lo sacan de la ventana" de la aplicación y lo sueltan en el escritorio, con lo cual pierden el TLabel. Me gustaría saber como devolver el TLabel a su sitio en caso de soltarlo fuera, igual que hago dentro de la ventana de la aplicación. Espero que se entienda.
nlsgarcia
28-11-2012, 16:03:53
bulc,
Los alumnos llevan el TLabel (Cursor de Drag), pero algunos "lo sacan de la ventana" de la aplicación y lo sueltan en el escritorio, con lo cual pierden el TLabel. Me gustaría saber como devolver el TLabel a su sitio en caso de soltarlo fuera, igual que hago dentro de la ventana de la aplicación
El control de los límites de la ventana se puede hacer por medio de la API ClipCursor, lo cual evitara que el TLabel salga fuera del formulario.
Revisa este link:
¿Cómo hacer un puzzle sencillo para niños?: http://www.clubdelphi.com/foros/showthread.php?t=81520
Espero sea útil :)
Nelson.
No entiendo eso de la API que mencionas. ¿Podrías extenderte un poco más?. Gracias de todas formas.
¿Tu aplicación es MDI?, ¿Tus formularios se crean en tiempo de ejecución? (¿incluido el formulario abeja?) Options
¿Y cual es la funcionalidad correcta? estas habilitando Drag and Drop para las letras de la palabra, ¿para que?, ¿para que la lleven a un panel?, ¿para que la saquen de la pantalla?...
Comparto un poco la respuesta de Al
Dices mucho pero... faltan detalles, no podemos ayudarte adivinando tu código.... ¿puedes poner ejemplos mas concretos?
Soy Bulc. He hecho otra Form calcada de la de Abeja. He borrado la anterior y la he guardado en el projecto, y listo. Esta vez ya no aparece al ejecutarse la aplicación. Sólo cuando se la llama con Show.
Me quedaré con las ganas de saber por qué diantres arrancaba por su cuenta. Espero no molestar. Ahora me queda saber como limitar el arrastre de los TLabel a la ventana que los contiene sin poder sacarlos el escritorio...
nlsgarcia
28-11-2012, 18:12:50
bulc,
No entiendo eso de la API que mencionas. ¿Podrías extenderte un poco más?
Revisa este código:
// Limita el movimiento del Cursor solo a Form1 : Activa Clipping State
procedure TForm1.FormActivate(Sender: TObject);
var
R: TRect;
begin
R:= GetClientRect;
MapWindowPoints(Handle,0,R,2);
ClipCursor(@R);
end;
// Necesario para salir de Form1
procedure TForm1.btnSalirClick(Sender: TObject);
begin
Close
end;
El código anterior evita que el cursor salga de Form1 por medio del API ClipCursor.
No es MDI, es una aplicación multificha normal. Carga 20 ventanas=fichas al iniciarse
Revisa este código:
// Remueve el Clipping State
procedure TForm1.RemoveClippingStateClick(Sender: TObject);
begin
ClipCursor(nil);
end;
El código anterior devuelve la funcionalidad normal al cursor. Es necesario si tienes más de un formulario en tu aplicación para remover el Clipping State.
Todo el código anterior se encuentra en el link mencionado anteriormente.
Espero sea útil :)
Nelson.
bulc,
Revisa este código:
procedure TForm1.RemoveClippingStateClick(Sender: TObject);
begin
ClipCursor(nil);
end;
El código anterior devuelve la funcionalidad normal al cursor (Remueve el Clipping State).
También puedes salir de la aplicación con la secuencia de teclas ALT+F4.
Espero sea útil :)
Nelson.
No sé si me he explicado bien. Lo que quiero es evitar que un Drag de TLabel, salga fuera del TForm y si se levanta el botón del ratón, se pierda. Bulc.
nlsgarcia
28-11-2012, 18:29:58
bulc,
La función ClipCursor(nil) devuelve la funcionalidad normal al cursor. Es necesario si tienes más de un formulario en tu aplicación para remover el Clipping State, en caso contrario no es requerido.
Espero sea útil :)
Nelson.
ecfisa
28-11-2012, 18:40:59
El objetivo de esta aplicación escolar es llevar letras TLabel para formar la palabra del animal que se muestras en un TImage. Debajo hay otro TImage de fondo tapado con otros TImages de Tapa.
Al dejar el TLabel que se arrastra, aparece la letra, etc...
No es MDI, es una aplicación multificha normal. Carga 20 ventanas=fichas al iniciarse. El objeto es llevar letras (TLabel) grandes a unas TImages. Al hacer Drop en la Imagen, aparece una letra, etc. (Se entiende?)
Los alumnos llevan el TLabel (Cursor de Drag), pero algunos "lo sacan de la ventana" de la aplicación y lo sueltan en el escritorio, con lo cual pierden el TLabel. Me gustaría saber como devolver el TLabel a su sitio en caso de soltarlo fuera, igual que hago dentro de la ventana de la aplicación. Espero que se entienda.
Hola bulc.
¿ Pero esto no es lo mismo que se trato anteriormente [ aquí (http://www.clubdelphi.com/foros/showthread.php?t=81520) ] ?
Saludos.
bulc,
La función ClipCursor(nil) devuelve la funcionalidad normal al cursor. Es necesario si tienes más de un formulario en tu aplicación para remover el Clipping State, en caso contrario no es requerido.
Espero sea útil :)
Nelson.
Sigo sin entender... Si ClipCursor(nil) hace normal el cursor, ¿dónde lo coloco? En el evento onDrop, ¿quizás? Pero, es q si está fuera del Form=origen del TLabel, no se activaría. ¿Cómo lo ves?
Me he dado cuenta que al hacer BeginDrag(True), salta el cursor de la notita y el OnMouseUp del TLabel, también se activa, con prioridad al Drop. Por ahí iba yo, pero nada. He probado con el código que me sugieren pero nada.
Saludos. Bulc.
Hola bulc.
¿ Pero esto no es lo mismo que se trato anteriormente [ aquí (http://www.clubdelphi.com/foros/showthread.php?t=81520) ]?
Saludos.
Pero sin solución.
ecfisa
28-11-2012, 20:01:34
Hola bulc.
Creo que vas a tener que darnos mas información, por que de este modo estamos tratando de adivinar como tenes organizada tu aplicación.
De acuerdo a lo que comentas:
El objetivo de esta aplicación escolar es llevar letras TLabel para formar la palabra del animal que se muestras en un TImage. Debajo hay otro TImage de fondo tapado con otros TImages de Tapa.
Al dejar el TLabel que se arrastra, aparece la letra, etc...
No es MDI, es una aplicación multificha normal. Carga 20 ventanas=fichas al iniciarse. El objeto es llevar letras (TLabel) grandes a unas TImages. Al hacer Drop en la Imagen, aparece una letra, etc. (Se entiende?)
Los alumnos llevan el TLabel (Cursor de Drag), pero algunos "lo sacan de la ventana" de la aplicación y lo sueltan en el escritorio, con lo cual pierden el TLabel. Me gustaría saber como devolver el TLabel a su sitio en caso de soltarlo fuera, igual que hago dentro de la ventana de la aplicación. Espero que se entienda.
Me surgen las siguientes dudas:
¿ Que función desempeñan esas 20 ventanas ?
¿ Quién es su Parent ?
¿ Donde estan situados los TImage ?
¿ Donde los TLabel ?
¿ De cuáles de las ventanas los alumnos sacan el TLabel hacia el escritorio ?
Saludos.
nlsgarcia
29-11-2012, 05:49:03
bulc,
No sé si me he explicado bien. Lo que quiero es evitar que un Drag de TLabel, salga fuera del TForm y si se levanta el botón del ratón, se pierda.
Revisa este código:
unit Unit1;
interface
uses
Windows, Messages, SysUtils, Variants, Classes, Graphics, Controls, Forms,
Dialogs, jpeg, ExtCtrls, StdCtrls, MMSystem;
type
TForm1 = class(TForm)
txtSiete: TLabel;
Button2: TButton;
txtNumero: TLabel;
txtUno: TLabel;
txtNueve: TLabel;
Button3: TButton;
procedure FormDrapDrop(Sender, Source: TObject; X, Y: Integer);
procedure FormDragOver(Sender, Source: TObject; X, Y: Integer; State: TDragState; var Accept: Boolean);
procedure Button2Click(Sender: TObject);
procedure FormActivate(Sender: TObject);
procedure LabelDragOver(Sender, Source: TObject; X, Y: Integer; State: TDragState; var Accept: Boolean);
procedure FormCreate(Sender: TObject);
procedure Button3Click(Sender: TObject);
private
{ Private declarations }
iComponenteX, iComponenteY: Integer;
bMoviendo: Boolean;
public
{ Public declarations }
end;
var
Form1: TForm1;
PosLabel : Array[1..9] of TPoint;
implementation
{$R *.dfm}
// Asigna nuevas coordenadas a un Tlabel en Drag&Drog
procedure TForm1.FormDrapDrop(Sender, Source: TObject; X, Y: Integer);
begin
if Source is TLabel then
begin
TLabel(Source).Left := X;
TLabel(Source).Top := Y;
end;
end;
// Activa Drag&Drog para un TLabel
procedure TForm1.FormDragOver(Sender, Source: TObject; X, Y: Integer;
State: TDragState; var Accept: Boolean);
begin
if Source is TLabel then
Accept := (Source is TLabel);
end;
// Realiza Acciones en Modo Drag&Drog
procedure TForm1.LabelDragOver(Sender, Source: TObject; X, Y: Integer; State: TDragState; var Accept: Boolean);
begin
if (Source is TLabel) then
begin
if (TLabel(Source).Name = 'txtSiete') and (State = dsDragEnter) then
begin
txtSiete.Enabled := False;
txtSiete.Visible := False;
PlaySound('Correcto.wav',0, SND_FILENAME or SND_ASYNC);
ShowMessage('Número Correcto');
end;
if (TLabel(Source).Name <> 'txtSiete') and (State = dsDragEnter) then
begin
PlaySound('Incorrecto.wav',0, SND_FILENAME or SND_ASYNC);
ShowMessage('Número Incorrecto');
end
end;
end;
// Activa el Clipping Status
procedure TForm1.FormActivate(Sender: TObject);
var
R: TRect;
begin
R:= GetClientRect;
MapWindowPoints(Handle,0,R,2);
ClipCursor(@R);
end;
// Remove el Clipping Status
procedure TForm1.Button2Click(Sender: TObject);
begin
ClipCursor(nil);
end;
// Inicializa el Form1
procedure TForm1.FormCreate(Sender: TObject);
begin
txtUno.DragMode := dmAutomatic;
PosLabel[1].X := txtUno.Left;
PosLabel[1].Y := txtUno.Top;
txtSiete.DragMode := dmAutomatic;
PosLabel[7].X := txtSiete.Left;
PosLabel[7].Y := txtSiete.Top;
txtNueve.DragMode := dmAutomatic;
PosLabel[9].X := txtNueve.Left;
PosLabel[9].Y := txtNueve.Top;
end;
// Reset el Form1
procedure TForm1.Button3Click(Sender: TObject);
begin
txtUno.Left := PosLabel[1].X;
txtUno.Top := PosLabel[1].Y;
txtSiete.Left := PosLabel[7].X;
txtSiete.Top := PosLabel[7].Y;
txtSiete.Enabled := True;
txtSiete.Visible := True;
txtNueve.Left := PosLabel[9].X;
txtNueve.Top := PosLabel[9].Y;
end;
end.
El código anterior hace Drag&Drop de 3 TLabel (Números) y verifica si se selecciono el número correcto. Este ejemplo hace uso de la función ClipCursor la cual limita el movimiento del cursor solo a la coordenadas sobre las cuales se definió y muestra como remover el Clipping Status.
La aplicación esta implementada en el siguiente link: http://terawiki.clubdelphi.com/Delphi/Ejemplos/?download=Drag%26Drop_Numeros.rar
Espero sea útil :)
Nelson.
Gracias por tu esfuerzo. Estudio el código y te cuento. Bulc
bulc,
Revisa este código:
procedure TForm1.RemoveClippingStateClick(Sender: TObject);
begin
ClipCursor(nil);
end;
El código anterior devuelve la funcionalidad normal al cursor (Remueve el Clipping State).
También puedes salir de la aplicación con la secuencia de teclas ALT+F4.
Espero sea útil :)
Nelson.
Nelson, he montado el proyecto tal como indicabas y realmente has dado en el clavo. El cursor queda limitado al área cliente. Todo a pedir de boca. Eres un genio. Gracias mil. !!
vBulletin v3.6.8, Derechos ©2000-2024, Jelsoft Enterprises Ltd.