[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"doc-detail-157415-es":3,"doc-seo-157415-110":31,"detail-sidebar-cat-0-es-110":92},{"code":4,"msg":5,"data":6},0,"success",{"doc_id":7,"user_id":8,"nickname":9,"user_avatar":10,"doc_module":4,"category_id":11,"category_name":12,"doc_title":13,"doc_description":14,"doc_content":15,"file_id":16,"file_url":17,"file_type":18,"file_size":19,"view_count":20,"is_deleted":4,"is_public":21,"is_downloadable":21,"audit_status":21,"page_count":22,"language":23,"language_code":24,"site_id":25,"html_lang":24,"table_of_contents":26,"faqs":27,"seo_title":28,"seo_description":14,"update_tm":29,"read_time":30},157415,4398048949847,"Eliana","https://ap-avatar.wpscdn.com/avatar/400002536579ef2da7f?_k=1778318612642679267",24,"Tecnología","Colección de Juegos - Pong y Pintar - Tutorial para crear una aplicación con múltiples ventanas","Colección de Juegos guía paso a paso el diseño de una aplicación que unifica dos juegos, Pong y Pintar, mediante la creación de múltiples ventanas y una pantalla inicial orientada a navegar entre juegos. El tutorial define el comportamiento esperado de Pong como una “spec”, describe modos de inicio, reglas de movimiento, rebote y finalización, y descompone la implementación en componentes clave: Notificador, Lienzo y SpriteImagen, con recomendaciones de nombramiento descriptivo.","Colección de Juegos  \nVamos a crear una aplicación que contenga un par de juegos diferentes. Empecemos con dos juegos diferentes: Pong y Pintar.  \nPara tener dos juegos diferentes unificados en una aplicación, vamos a necesitar por lo menos tres ventanas. Podríamos tener más, dependiendo de cómo diseñemos nuestra aplicación. Puedes añadir una nueva pantalla usando el botón que dice “Añadir ventana”  \nNOTA: La Screen1 que se crea automáticamente desde el principio, siempre será la primer ventana que aparezca cuando tu aplicación ya terminada se abra .  \nPrimero diseña tu ventana inicial.  \nPantalla Inicial  \n¿Qué necesitamos poner en la pantalla principal? Antes de siquiera preguntarnos esto, deberíamos pensaracerca de cuál es el objetivo que debería tener esta pantalla. Uno de sus principales propósitos es el de navegar entre los diferentes juegos que tienes. ¿Cuáles son los demás propósitos de esta pantalla?  \n______________________________________________________________________________  \n______________________________________________________________________________  \n¿Qué componentes pondrás a la pantalla inicial para poder navegar entre tus juegos? ( Pista: Piensa sobre cómo se navega entre pantallas en otras aplicaciones que conoces)  \n______________________________________________________________________________  \n______________________________________________________________________________  \nPong -Tu primer juego  \nPara empezar - ¿Qué es el juego de pong?  \nPara aquellos que no lo conocen, pong es un juego de tenis de mesa virtual (ping pong) . Hay una “paleta” encada lado de la pantalla y un “balón” como el que se muestra en la imagen de arriba. El objetivo es ganarregresando el balón al oponente de tal forma que se le pase.  \n¿Có mo queremos nosot ras que funcione el juego?  \nAntes de empezar a programar cualquier parte del juego, necesitamos definir cómo queremos que funcione, esto se conoce como crear un “spec”. El spec es la lista de todos los componentes y las propiedades que tendrá el juego para cumplir el objetivo que acabamos de describir.  \nPensemos sobre iniciar el juego, jugarlo y terminarlo.  \nEl juego puede iniciar de diferentes maneras:  \n● El usuario da click en una notificación y después comienza el juego.  \n● El balón se empieza a mover inmediatamente cuando el juego se abre.  \n● El usuario arroja el balón para iniciar el juego.  \nEste tutorial te guiará a través de la primera opción (la notificación) , pero te recomendamos investigar las otrasopciones una vez que termines este tutorial.  \nSiguiente, ¿cómo se jugará el juego?  \n1. Los jugadores podrán mover de arriba a abajo sus paletas para evitar que el balón entre por el lado izquierdo o derecho de la pantalla.  \n2. El balón rebotara cuando pegue en el marco superior o inferior de la ventana.  \n3. El balón rebotara cuando pegue con una de las paletas.  \n4. El balón se detendrá cuando pegue en el lado izquierdo o derecho de la ventana.  \nFinalmente, cuando un jugador pierta ¿cómo funcionará el juego? Otra vez, hay algunas opciones diferentes:  \n● El juego va a mostrar una notificación diciendo quién ganó y quién perdió el juego.  \n● Se va a poner reiniciar el juego.  \n● Ambas opciones descritas arriba.  \nAhora que sabemos cómo debe funcionar el juego, necesitamos explorar los componentes que necesitamos.➔ Notificador  \n➔ Pelota  \n➔ Lienzo  \n➔ SpriteImagen  \nComponente Notificador  \nEl componente Notificador le permite a la aplicación mandar alertas alusuario mientras está usando la aplicación. ¿Cómo se podría usar el notificador en la aplicación?  \n___________________________________________________  \n___________________________________________________  \nComponente Lienzo  \nEl Lienzo es el componente en el cual una spriteImagen puede ser movida o también el usuario puede dibujar. ¿Cómo piensas que usaremos el lienzo para esto?  \n___________________________________________________  \n___________________________________________________  \nComponente Spr","cbCaievqPKXMlWla","https://ap.wps.com/l/cbCaievqPKXMlWla","pdf",6608786,2,1,28,"Spanish","es",110,"# Colección de Juegos\n## Planteamiento: una aplicación con dos juegos\n## Pantalla inicial y navegación entre juegos\n## Pong: objetivo, reglas y especificación (spec)\n## Componentes: Notificador, Lienzo y SpriteImagen\n## Buenas prácticas de programación y nombramiento descriptivo","[{\"question\":\"¿Cuántas ventanas necesita la aplicación para unificar dos juegos como Pong y Pintar?\",\"answer\":\"Se requiere al menos tres ventanas para que la app unifique dos juegos diferentes; podrían añadirse más según el diseño.\"},{\"question\":\"¿Cuál es el propósito principal de la pantalla inicial en este tutorial?\",\"answer\":\"Navegar entre los diferentes juegos que tiene la aplicación; también se describen otros propósitos relacionados con esa transición.\"},{\"question\":\"¿Qué componentes se mencionan como necesarios para construir la pantalla de Pong?\",\"answer\":\"Se listan Notificador, Pelota, Lienzo y SpriteImagen, además de considerar cómo interactúan entre sí en la pantalla.\"}]","Colección de Juegos - Pong y Pintar - Tutorial para crear una aplicación con múltiples ventanas | PDF",1787980664,43,{"code":4,"msg":32,"data":33},"ok",{"site_id":25,"language":24,"slug":34,"title":13,"keywords":35,"description":14,"schema_data":36,"social_meta":87,"head_meta":89,"extra_data":91,"updated_unix":29},"game-collection-pong-and-paint-tutorial-to-build-an-app-with-multiple-windows","",{"@graph":37,"@context":86},[38,54,69],{"@type":39,"itemListElement":40},"BreadcrumbList",[41,45,48,51],{"item":42,"name":43,"@type":44,"position":21},"https://docshare.wps.com","Home","ListItem",{"item":46,"name":47,"@type":44,"position":20},"https://docshare.wps.com/es/document/","Document",{"item":49,"name":12,"@type":44,"position":50},"https://docshare.wps.com/es/document/tecnología/",3,{"item":52,"name":13,"@type":44,"position":53},"https://docshare.wps.com/es/document/game-collection-pong-and-paint-tutorial-to-build-an-app-with-multiple-windows/157415/",4,{"url":52,"name":13,"@type":55,"author":56,"headline":13,"publisher":58,"fileFormat":61,"inLanguage":24,"description":14,"dateModified":62,"datePublished":63,"encodingFormat":61,"isAccessibleForFree":64,"interactionStatistic":65},"DigitalDocument",{"name":9,"@type":57},"Person",{"url":42,"name":59,"@type":60},"DocShare","Organization","application/pdf","2026-09-06","2026-08-29",true,{"@type":66,"interactionType":67,"userInteractionCount":20},"InteractionCounter",{"@type":68},"ViewAction",{"@type":70,"mainEntity":71},"FAQPage",[72,78,82],{"name":73,"@type":74,"acceptedAnswer":75},"¿Cuántas ventanas necesita la aplicación para unificar dos juegos como Pong y Pintar?","Question",{"text":76,"@type":77},"Se requiere al menos tres ventanas para que la app unifique dos juegos diferentes; podrían añadirse más según el diseño.","Answer",{"name":79,"@type":74,"acceptedAnswer":80},"¿Cuál es el propósito principal de la pantalla inicial en este tutorial?",{"text":81,"@type":77},"Navegar entre los diferentes juegos que tiene la aplicación; también se describen otros propósitos relacionados con esa transición.",{"name":83,"@type":74,"acceptedAnswer":84},"¿Qué componentes se mencionan como necesarios para construir la pantalla de Pong?",{"text":85,"@type":77},"Se listan Notificador, Pelota, Lienzo y SpriteImagen, además de considerar cómo interactúan entre sí en la pantalla.","https://schema.org",{"og:url":52,"og:type":88,"og:title":13,"og:site_name":59,"og:description":14},"article",{"robots":90,"canonical":52},"index,follow",{"doc_id":7,"site_id":25},{"code":4,"msg":5,"data":93},[94,99,102,106,110,114,118,122,126,130],{"id":95,"doc_module":4,"doc_module_name":47,"category_name":96,"show_sort_weight":97,"slug":98},39,"Cómic",60,"comic",{"id":30,"doc_module":4,"doc_module_name":47,"category_name":100,"show_sort_weight":97,"slug":101},"Estilo de Vida","lifestyle",{"id":103,"doc_module":4,"doc_module_name":47,"category_name":104,"show_sort_weight":97,"slug":105},38,"Examen","exam",{"id":107,"doc_module":4,"doc_module_name":47,"category_name":108,"show_sort_weight":97,"slug":109},44,"General","general",{"id":111,"doc_module":4,"doc_module_name":47,"category_name":112,"show_sort_weight":97,"slug":113},41,"Investigación e Informes","research-report",{"id":115,"doc_module":4,"doc_module_name":47,"category_name":116,"show_sort_weight":97,"slug":117},37,"Literatura","literature",{"id":119,"doc_module":4,"doc_module_name":47,"category_name":120,"show_sort_weight":97,"slug":121},22,"Relatos y Novelas","story-novel",{"id":123,"doc_module":4,"doc_module_name":47,"category_name":124,"show_sort_weight":97,"slug":125},42,"Religión y Espiritualidad","religion-spirituality",{"id":127,"doc_module":4,"doc_module_name":47,"category_name":128,"show_sort_weight":97,"slug":129},40,"Salud y Atención Médica","healthcare",{"id":11,"doc_module":4,"doc_module_name":47,"category_name":12,"show_sort_weight":97,"slug":131},"technology"]