Skip to Content
Technical Articles

Custom Tile en Portal SCP I

Hola a toda la comunidad. En este Post voy a guiar paso a paso para crear un Custom Tile y publicarlo en Portal.

 

Antes que todo ¿Qué es un Custom Tile? Un Custom Tile es un Tile al cual puedes agregar distintos controles. El siguiente es el ejemplo que trabajaremos en este Post

 

¡MANOS A LA OBRA!

Para diseñar y publicar esta maravilla lo primero que haremos es crear una aplicación SAPUI5.

Creada nuestra aplicación SAPUI5 vamos a editar la vista creada por defecto del tal modo que quede así

 

Puedes copiar el código de más abajo siempre procurando cambiar el controllerName.

<mvc:View xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:micro="sap.suite.ui.microchart"
	controllerName="cl.paguilas.flp_tile_demo.controller.App" displayBlock="true">
	<GenericTile header="Header" subheader="Sub Header">
		<tileContent>
			<TileContent>
				<content>
					<micro:HarveyBallMicroChart total="100" size="Responsive" alignContent="Right" totalScale="Mrd">
						<micro:items>
							<micro:HarveyBallMicroChartItem fraction="63.5" color="Good" fractionScale="Mrd"/>
						</micro:items>
					</micro:HarveyBallMicroChart>
				</content>
			</TileContent>
		</tileContent>
	</GenericTile>
</mvc:View>

 

Si ejecutas la aplicación se debería ver algo así

 

AHORA A PORTAL

Con todo listo toca ahora publicar la aplicación con un clásico deploy

 

Una vez realizado el paso anterior debemos configurar la aplicación en Portal. Para que tenga la visualización deseada, los parámetros quedarían de la siguiente forma:

Si tienes dudas de donde salen esos parámetros, los puedes ver en la pestaña “Propiedades”:

 

El último paso es publicar los cambios

 

Con todo esto ya tendremos nuestro Custom Tile publicado en nuestra plataforma(primera imagen). En el siguiente Post presentaré como consumir un servicio para refrescar la información cada “x” tiempo.

 

Esta información y más puedes encontrarla en el libro “SAP Fiori Launchpad – Development and Extensibility”

 

¡Saludos!

2 Comments
You must be Logged on to comment or reply to a post.