Många gånger är det användbart att lägga till bilder i sina appar för att skapa intresse, hjälpa användaren att snabbt hitta rätt mätetal och liknande.
Man kan lägga till bilder i det vanliga inbyggda ”Text och bild”-objektet, men mängden inställningar är begränsade. Till exempel kan man inte skala bilden på ett bra sätt eller lägga den centrerad i både höjd och bredd.
Ett bättre alternativ kan vara att använda det lilla gratis tillägget SimpleImage. Med det här tillägget kan man enkelt lägga till bilder som skalas om till en bra storlek och som även centreras både vertikalt och horisontellt.
Börja med att ladda ner och installera tillägget i Sense QMC (kräver att du är administratör). Därefter dyker det upp under Komplement/Extensions när du är inne och arbetar med ark.
Dra ut ett objekt till arbetsytan och gå till inställningarna. De viktigaste funktionerna finns under Image Params.
Image Path
Sökvägen i Sense-miljön där bilder finns. För uppladdade bilder är detta normalt till exempel ”/api/v1/apps/75d21589-9cda-4628-bb02-be4f5b14b4a3/media/files/” där ”75d21589-9cda-4628-bb02-be4f5b14b4a3” är den aktuella appen. För slippa uppdatera app ID om man t.ex. kopierar lösningen till en annan app så kan man generera app id istället. Inställningsfältet stödjer en dynamisk beräkning som då kan vara (DocumentName() kommer att ersättas med aktuellt app ID):
='/api/v1/apps/' & DocumentName() & '/media/files/'Det är viktigt att sökvägen börjar och slutar med ett /-tecken enligt exemplet ovan.
Image File
Här skriver man in namnet på bildfilen som ska visas. Till exempel logotype.png eller liknande.
Image Style CSS
Här kan man lägga in CSS-kod som formaterar bildobjektet. Vanligt är att man vill centrera bilden horisontellt och vertikalt. Detta kan göras med följande kodsnutt:
='position:relative;display:block;margin-top:2px;margin-right:auto;margin-bottom:auto;margin-left:auto;max-height:100%;max-width:100%;top:50%;transform:translateY(-50%);'Image Title
Här kan man skriva en text som visas om man håller musen över bilden.
Image Link
Här kan man skriva in en url till en sida som användaren ska skickas till om man klickar på bilden. Den nya sidan öppnas i en ny flik.
Full Screen Option
Den här inställningen är troligen förlegad då objektet inte påverkas om valet är aktivt eller ej.
Remove Sheet Object Header
Den här inställningen tar bort rubriken från objektet. Denna kan också tas bort genom att klicka ur Visa rubriker på Allmänt-fliken bland objektets inställningar.
Remove Sheet Object Padding
Den här inställningen tar bort ett litet tomrum som skapas mellan objekt.
Nu har vi en bild som placeras fint:
