Sto utilizzando sapUI5 con un SAP Hana DB per creare un dashboard personalizzato. Ho un sap.m.TileContainer che contiene un numero di sap.m.CustomTiles che sono legati dall'aggregazione "tiles" di TileContainer da una struttura JSON.tile sapUI5 personalizzato non visualizzato in Chrome, ma Firefox
Ora, ho bisogno di aggiungere un altro CustomTile (con layout e contenuto diverso) nella funzione init del mio controller tramite il codice seguente. Funziona perfettamente bene in Firefox, ma in Chrome Tile è semplicemente non mostrato e anche io non riesco a trovarlo all'interno degli elementi HTML:
var oTileContainer = this.getView().byId("tileContainer");
var quantTile = new sap.m.CustomTile("quantTile",{
content: [
new sap.m.VBox({
items: [
new sap.m.Title("quantTileTitle", {
width : "100%",
text : "Quantitative KPIs",
titleStyle : "H4",
textAlign: "Begin",
}).addStyleClass('sapUiTinyMarginBegin sapUiTinyMarginTop'),
new sap.ui.commons.HorizontalDivider({
height : "Medium"
}),
new sap.m.RatingIndicator("quantTotalRating",{
enabled : false,
maxValue : 5,
value : 2.5
}).addStyleClass('sapUiMediumMarginBegin sapUiMediumMarginTop'),
new sap.m.Label({
text : "Gesamtbewertung",
width : "100%",
textAlign: "Center"
}).addStyleClass('')
]
})
],
press: this.handleTilePress
}).addStyleClass('sapMTile quantTile');
oTileContainer.insertTile(quantTile,0);
Per completezza, ecco la parte rilevante del mio punto di vista XML:
<TileContainer
id="tileContainer"
tileDelete="handleTileDelete"
tiles="{/TileCollection}">
<CustomTile
class="sapMTile"
press="handleTilePress">
<content>
<l:FixFlex vertical="true">
<l:fixContent>
<VBox>
<HBox alignItems="Center">
<c:Icon
src="sap-icon://{icon}"
size="1rem"
color="#000000"
class="sapUiTinyMarginBeginEnd sapUiTinyMarginTop"/>
<VBox class="sapUiTinyMarginTop">
<Title text="{title}" titleStyle="H4"/>
</VBox>
</HBox>
<u:HorizontalDivider height="Medium" />
</VBox>
</l:fixContent>
<l:flexContent>
<VBox>
<Label text="Letzte Woche" class="sapUiTinyMargin" width="100%" textAlign="Begin"/>
<HBox
alignItems="Center"
justifyContent="Center">
<Label text="{positive_week}" class="sapUiTinyMargin sapUiMediumMarginEnd KPIpositive"/>
<Label text="{negative_week}" class="sapUiTinyMargin KPInegative"/>
</HBox>
<Label text="Letzter Monat" class="sapUiTinyMargin" width="100%" textAlign="Begin"/>
<HBox
alignItems="Center"
justifyContent="Center">
<Label text="{positive_month}" class="sapUiTinyMargin sapUiMediumMarginEnd KPIpositive"/>
<Label text="{negative_month}" class="sapUiTinyMargin KPInegative"/>
</HBox>
</VBox>
</l:flexContent>
</l:FixFlex>
</content>
</CustomTile>
</TileContainer>
Qualcuno ha idea del motivo per cui potrebbe non essere visualizzato/visualizzato in Chrome, ma in Firefox? C'è qualche procedura che posso chiamare per forzare un re-rendering o qualcosa di simile?
Grazie
Ho appena testato, che se faccio scattare il codice JS, ad es. da un pulsante, quindi, la piastrella viene perfettamente aggiunta alla raccolta anche in Firefox. Quindi è solo su come e quando viene aggiunto. Ma anche ritardare l'aggiunta della tessera per un timeout non è stato d'aiuto. Ho provato a metterlo in onAfterRendering() così come nella funzione onInit(). Ci sono altri eventi di questo tipo che non conosco? – Jens
Puoi provare a riprodurre questo problema in un piccolo JSBin o qualcosa del genere? –
Ecco un post in cui sono descritti alcuni altri eventi. Hai verificato se Chrome ha attivato gli eventi (onInit, onAfterRendering)? – Carsten