Gonzalo Rementeria

13 – Como Instalar PensPlace paso a paso

Si no conoces PensPlace o no sabes cómo puedes disfrutarlo, hoy estás de suerte. Porque en esta breve entrada te cuento que es y cómo puedes instalarlo. ¿Qué es PensPlace? Según se describe en su página de GitHub es el recurso definitivo para usar iconos en Power Apps. Y no puedo estar más de acuerdo, pues nos ofrece más de 110000 iconos. Si has leído bien, más de cien mil iconos en formato SVG (es decir que se escalan automáticamente para no perder definición y se vean igual de nítidos tanto si la imagen mide 100x100px como si mide 10000x10000px). Además de esto, PensPlace ofrece otra serie de ventajas como son que todos estos iconos están categorizados, que podemos marcar los que queramos como favoritos para poder encontrarlos rápidamente. Ofrece un buscador, podemos modificar sus colores, posiciones, etc. Al final de este post te dejaré el enlace al GitHub oficial.

¿Cuánto cuesta esta maravilla?

Nada, es gratuito.

Ahora me interesa aún más… ¿Qué es exactamente?

Es una canvas app que se nutre de una serie de tablas de Dataverse donde se alojan los más de 100K iconos. Los cuales podremos usar para nuestras Power Apps.

 

¿Qué necesito para descargarlo e instalarlo?

Necesitas tener un entorno de Power Platform con Dataverse.

 

¿Pasos a seguir?

A continuación, te detallo los pasos a seguir, pero antes, este es el resumen de lo que vas a tener que hacer. Primero instalar 3 herramientas (en este orden): Creator kit, Power Drag Drop Code Component y PensPlace. A continuación, instalaremos una herramienta más (para poder cargar esos más de 100K iconos) y por último cargaremos esos iconos en nuestro tenant.

1º Instalar el PowerCAT Creator Kit

Aquí os dejo su GitHub

https://github.com/microsoft/powercat-creator-kit

O la opción que os recomiendo yo, instalarlo desde este enlace.

https://appsource.microsoft.com/en-us/product/dynamics-365/microsoftpowercatarch.creatorkit1?tab=Overview

2º Instalar la herramienta Power Drag Drop Code Component

Aquí os dejo el enlace a su GitHub.

https://github.com/scottdurow/power-drag-drop

o la opción rápida que os recomiendo yo.

https://github.com/scottdurow/power-drag-drop/releases/download/v1.0.27/PowerDragDrop_managed_1_0_27.zip

Una vez descargada iremos a soluciones y la importaremos.

3º Instalar PensPlace

https://github.com/P3N-101/ResourceKit/blob/main/PowerAppsResourceKit_1_0_0_10_managed.zip

Pulsaremos en el botón de Raw para descargarlo y posteriormente lo instalaremos como en el paso anterior.

4º Descargar el paquete con los más de 100k iconos

https://github.com/P3N-101/ResourceKit/blob/main/data-241023.zip

5º Cargar el paquete de datos con la CLI

Para hacer esto tenemos varias opciones, yo te recomiendo hacer lo siguiente, instalar Visual Studio Code. Instalar su extensión (Power Platform Tools), que si has visto mi artículo sobre como destripar las canvas app para ver su código ya lo tendrás instalado, y si no, te dejo aquí el link para que puedas verlo.

https://gonzalorementeria.com/2023/10/03/destripando-las-canvas-app/

Abrir la consola de comando y poner este comando.

Pac tool cmt

Y cargar los datos en el tenant donde has subido el resto de soluciones. Igualmente, al final del artículo te adjunto un par de links por si tuviste algún problema o duda. Ya que es un proceso algo largo.

6º Ya puedes empezar a usarlo.

Para ello solo tendrás que abrir la canvas app que instalaste en el paso 3º y que se llama “icons” y deberás ver algo como esto (si lo ves vacío es que no cargaste los datos) y aquí ya podrás copiar y pegar el svg en el componente imagen de cualquier canvas app. O bien descargarlo y subir el archivo (aunque en este caso no podrás modificar luego el código, por si quisieses cambiar los colores, por ejemplo).

 

Espero que os haya sido útil. Aquí os dejo algunos links más. Un saludo.

OTROS RECURSOS

GitHub donde está subido elcódigo de PensPlace

https://github.com/P3N-101/ResourceKit

Link para Instalar Visual Studio Code

https://code.visualstudio.com/download

Video de como instalar y usar la CLI para cargar los datos en un tenant

https://www.youtube.com/watch?v=jxZDEPZSeI8