OData Service

How to display Image in sapui5

Pre-requisites

1.sapui5 framework
2.basic javascript knowledge

   Sometimes we may need to show images from sap backend in our ui5 applications.Its very simple.See it in action.



Steps
1.Create an image control.Here iam using sap.m.Image control.Be sure you have loaded sap.m library before using its controls.

var photo = new sap.m.Image({

});

2.Set src attribute of image control.You can use an odata url for image from backend or you can use local images strored in your app folder.Here I am using odata url. 
"http://services.odata.org/V4/(S(lelatahvudjfc2ujw0o35gpv))/TripPinServiceRW/Photos(1)/$value".For knowing how to

var photo = new sap.m.Image({
    width: "40%",
    src: "http://services.odata.org/V4/(S(lelatahvudjfc2ujw0o35gpv))/TripPinServiceRW/Photos(1)/$value"
});
photo.placeAt("content");

3.see it in action
Image sapui5


For knowing how to expose backend image through Netweaver Gateway refer blog  by Toney C Benoy
How to get Image through Netweaver Gateway
If you enjoyed this post, Please Share!!

0 comments :

Post a Comment

Powered by Blogger.