Image Gallery Screenlet for iOS

Requirements

  • Xcode 9.3 or above
  • iOS 11 SDK
  • Liferay Portal 6.2 CE/EE, Liferay CE Portal 7.0/7.1, Liferay DXP 7.0+
  • Liferay Screens Compatibility app (CE or EE/DXP). This app is preinstalled in Liferay CE Portal 7.0/7.1 and Liferay DXP 7.0+.

Compatibility

  • iOS 9 and above

Xamarin Requirements

  • Visual Studio 7.2
  • Mono .NET framework 5.4.1.6

Features

Image Gallery Screenlet shows a list of images from a Documents and Media folder in a Liferay instance. You can also use Image Gallery Screenlet to upload images to and delete images from the same folder. The Screenlet implements fluent pagination with configurable page size, and supports i18n in asset values.

JSON Services Used

Screenlets in Liferay Screens call JSON web services in the portal. This Screenlet calls the following services and methods.

ServiceMethodNotes
DLAppServicegetFileEntriesLoad
DLAppServicegetFileEntriesCount
DLAppServiceaddFileEntryUpload
DLAppServicedeleteFileEntryDelete

Module

  • None

Themes

The default Theme uses a standard iOS UICollectionView to show the scrollable list as a grid. Other Themes may use a different component, such as UITableView or others, to show the contents.

This screenlet has three different Themes:

  1. Grid (default)
  2. Slideshow
  3. List

Figure 1: Image Gallery Screenlet using the Grid, Slideshow, and List Themes.

Figure 1: Image Gallery Screenlet using the Grid, Slideshow, and List Themes.

Offline

This Screenlet supports offline mode so it can function without a network connection when loading or uploading images (deleting images while offline is unsupported). For more information on how offline mode works, see the tutorial on its architecture. This Screenlet supports the remote-only, cache-only, remote-first, and cache-first offline mode policies.

These policies take the following actions when loading images from a Liferay instance:

PolicyWhat happensWhen to use
remote-onlyThe Screenlet loads the data from the Liferay instance. If a connection issue occurs, the Screenlet uses the delegate to notify the developer about the error. If the Screenlet successfully loads the data, it stores it in the local cache for later use.Use this policy when you always need to show updated data, and show nothing when there’s no connection.
cache-onlyThe Screenlet loads the data from the local cache. If the data isn’t there, the Screenlet uses the delegate to notify the developer about the error.Use this policy when you always need to show local data, without retrieving remote information under any circumstance.
remote-firstThe Screenlet loads the data from the Liferay instance. If this succeeds, the Screenlet shows the data to the user and stores it in the local cache for later use. If a connection issue occurs, the Screenlet retrieves the data from the local cache. If the data doesn’t exist there, the Screenlet uses the delegate to notify the developer about the error.Use this policy to show the most recent version of the data when connected, but show a possibly outdated version when there’s no connection.
cache-firstThe Screenlet loads the data from the local cache. If the data isn’t there, the Screenlet requests it from the Liferay instance and notifies the developer about any errors that occur (including connectivity errors).Use this policy to save bandwidth and loading time in case you have local (but possibly outdated) data.

These policies take the following actions when uploading an image to a Liferay instance:

PolicyWhat happensWhen to use
remote-onlyThe Screenlet sends the image to the Liferay instance. If a connection issue occurs, the Screenlet uses the delegate to notify the developer about the error, but it also discards the image.Use this policy to make sure the Liferay instance always has the most recent version of the image.
cache-onlyThe Screenlet stores the image in the local cache.Use this policy when you need to save the image locally, but don’t want to update it in the Liferay instance.
remote-firstThe Screenlet sends the image to the Liferay instance. If this succeeds, it also stores the image in the local cache for later use. If a connection issue occurs, the Screenlet stores the image in the local cache and sends it to the Liferay instance when the connection is re-established.Use this policy when you need to make sure the Screenlet sends the image to the Liferay instance as soon as the connection is restored.
cache-firstThe Screenlet stores the image in the local cache and then attempts to send it to the Liferay instance. If a connection issue occurs, the Screenlet sends the image to the Liferay instance when the connection is re-established.Use this policy when you need to make sure the Screenlet sends the image to the Liferay instance as soon as the connection is restored. Compared to remote-first, this policy always stores the image in the cache. The remote-first policy only stores the image in the event of a network error.

Required Attributes

  • repositoryId
  • folderId

Attributes

AttributeData typeExplanation
repositoryIdnumberThe ID of the Liferay instance’s Documents and Media repository that contains the image gallery. If you’re using a site’s default Documents and Media repository, then the repositoryId matches the site ID (groupId).
folderIdnumberThe ID of the Documents and Media repository folder that contains the image gallery. When accessing the folder in your browser, the folderId is at the end of the URL.
mimeTypesstringThe comma-separated list of MIME types for the Screenlet to support.
filePrefixstringThe prefix to use on uploaded image file names.
offlinePolicystringThe offline mode setting. The default value is remote-first. See the Offline section for details.
autoLoadbooleanWhether the list automatically loads when the Screenlet appears in the app’s UI. The default value is true.
refreshControlbooleanWhether a standard iOS UIRefreshControl appears when the user does the pull to refresh gesture. The default value is true.
firstPageSizenumberThe number of items to display on the first page. The default value is 50.
pageSizenumberThe number of items to display on the second and subsequent pages. The default value is 25.
obcClassNamestringThe name of the OrderByComparator class to use to sort the results. Omit this property if you don’t want to sort the results. Note that you can only use comparator classes that extend OrderByComparator<DLFileEntry>. Liferay contains no such comparator classes. You must therefore create your own by extending OrderByComparator<DLFileEntry>. To see examples of some comparator classes that extend other Document Library classes, click here.

Methods

MethodReturnExplanation
loadList()booleanStarts the request to load the list of images. This list is shown when the response is received. Returns true if the request is sent successfully.

Delegate

Image Gallery Screenlet delegates some events to an object that conforms to the ImageGalleryScreenletDelegate protocol. This protocol lets you implement the following methods:

  • - screenlet:onImageEntriesResponse:: Called when a page of contents is received. Note that this method may be called more than once: one call for each page received.

  • - screenlet:onImageEntriesError:: Called when an error occurs in the process. The NSError object describes the error.

  • - screenlet:onImageEntrySelected:: Called when an item in the list is selected.

  • - screenlet:onImageEntryDeleted:: Called when an image in the list is deleted.

  • - screenlet:onImageEntryDeleteError:: Called when an error occurs during image file deletion. The NSError object describes the error.

  • - screenlet:onImageUploadStart:: Called when an image is prepared for upload.

  • - screenlet:onImageUploadProgress:: Called when the image upload progress changes.

  • - screenlet:onImageUploadError:: Called when an error occurs in the image upload process. The NSError object describes the error.

  • - screenlet:onImageUploaded:: Called when the image upload finishes.

  • - screenlet:onImageUploadDetailViewCreated:: Called when the image upload View is instantiated. By default, the Screenlet uses a modal view controller to present this View. You only need to implement this method if you want to override this behavior. This method should present the View, passed as parameter, and then return true. For example, the following example implementation presents ImageUploadDetailViewBase as a parameter, and then uses it to customize the View’s appearance:

      func screenlet(screenlet: ImageGalleryScreenlet, 
          onImageUploadDetailViewCreated uploadView: ImageUploadDetailViewBase) -> Bool {
              self.cardDeck?.cards[safe: 0]?.addPage(uploadView)
              self.cardDeck?.cards[safe: 0]?.moveRight()
              return true
      }
    
« Web Content List Screenlet for iOSRating Screenlet for iOS »
Was this article helpful?
0 out of 0 found this helpful