Intel XDK: Controls 11: Customizing IMAGE GALLERY Widget in App Designer 7

In this post we will add more images to the slide show in the IMAGE GALLERY widget in App Designer 7 of Intel XDK. We basically use the same documents we used earlier in the previous post here ( http://hodentekmobile.blogspot.com/2016/09/intel-xdk-controls-10-image-gallery.html ).

The design of the FIRST page in the TabbarWidget page has not changed.

Cntrl11_00.PNG

What gets changed are the extra images added to the gallery_images folder and the changes to the gallery-images.json page which points to these added images. Make sure the images added are 640x480.

It is very easy to locate the folder to place your images. Just right click gallery_images as shown and click Show in Explorer.

Cntrl11_01.PNG

I added four more images, BavarianAlps.png, PragueAerial.png, Vienna.png and Salzburg.png to the gallery_images folder.

Right click www under projects and click Refresh File Tree.Expand gallery_images and verify the images are there.

Cntrl11_02.PNG

Now modify the gallery_json page as shown:


The image file extensions in the .json file should correctly match the file name and file extensions of the images.

That is all there is to it.


Simulate and verify as shown.



For Sortable List review this.

Comments

Post a Comment

Popular posts from this blog

Apps with Mobile Roadie, the one-stop platform

Image
MobileRoadie is the platform to build mobile apps with rich features. It is also one-stop, build, manage, design and engage. It supports all media, photos, video and audio. The text color in the picture may not show you the logo clearly! Here are features taken from Mobile Roadie site . Using Photos: Upload your photos manually, or automatically pull in your photos from an RSS feed, Flickr account, Instagram account or hashtag, Mobypicture, Picasa, Twitpic, or Facebook Fan Page profile photos. Users will see your photos in a grid layout of your choosing, and can even play a slideshow of your photos. Embed news: Add news posts manually, or import automatically via RSS feed, Twitter account, or Google News keywords.     Each item has artwork, title, date & time, and HTML story content. FAN Wall:     Import your past and upcoming events from Artistdata, Bandsintown, Songkick, Plancast, Ticketmob, SonicLiving, Eventbrite, or ad...
Read more

Towards cross-platform development..

There are lots and lots of Apps. In fact there are over a couple of million Apps including all of the major brands, Apple, Google, Blackberry, Microsoft with Apple at the top and Microsoft in the bottom. But this is a growing market. The variety is truly bewildering, different size devices; different operating systems(OS); different programming languages;  and different orientations. This post is not very recent but you can see how the various mobile operating systems compare: http://www.ibtimes.com/android-vs-ios-whats-most-popular-mobile-operating-system-your-country-1464892 The interactive image in the article really shows the popularity of a given OS/device among different geographical regions. Windows Phone Apps is for example based on Microsoft's Window 7, 8, 8.1 OSs using .NET. With Windows OS and Visual Studio one can build Apps for all of Microsoft devices covering Phone, Tablet and Desktop. However Microsoft Windows Apps sans Html5/CSS/Javascript is OS specific. E...
Read more

Installing Android Studio 3.0 on Windows 10

Image
Android Studio 3.0 is the official Integrated Development environment (IDE) for Android app development. Android App studio brings in many features : • A flexible Gradle-based build system • A fast and feature-rich emulator • A unified environment where you can develop for all Android devices • Instant Run to push changes to your running app without building a new APK • Code templates and GitHub integration to help you build common app features and import sample code • Extensive testing tools and frameworks • Lint tools to catch performance, usability, version compatibility, and other problems • C++ and NDK support • Built-in support for Google Cloud Platform, making it easy to integrate Google Cloud Messaging and App Engine The installation is straight forward on Windows 10 as the installation program downloads all the necessary items during Android Studio installation. It is driven by a wizard which makes it very easy. You can downlo...
Read more