WaveMaker Learn

WaveMaker Learn

  • Docs
  • Widgets
  • How-to
  • Releases
  • Login
  • Start free trial

›- Mobile UI design

How-to-documents

  • How-to Wiki

App Development

  • How-tos: App Development

- App solution

  • Creating a Registration Page
  • Support for Password Encryption
  • Error Handling in WaveMaker App
  • Leaving Page with Unsaved Changes

- UI design

  • Passing Parameters to Pages
  • Passing Parameters to Partial Page
  • Use Static Variable to pass data between pages
  • Incorporating Additional Icons
  • Change Icon Color on Condition
  • Changing Default Favicon
  • Changing App Logo
  • Changing Page Title
  • Customise App Style
  • Customize an Existing Theme
  • Customizing Theme

- Localization

  • Localization in WaveMaker Apps
  • Setting Language and Date Format
  • Localization Using Select Locale
  • Localization of Error Messages

- Security

  • SAML Integration - OneLogin
  • SAML Integration - ADFS
  • Custom Security using Google OAuth Prefab
  • Multiple Security Provider Implementation
  • Customizing Post Authentication Handlers

- Databases

  • Queries with Dynamic Where Clause
  • Connect To Azure SQL Server
  • Download JDBC Driver jar
  • How to fetch more than the default number(100) of records from database?

- Web services

  • Using App Environment Properties
  • Using POST method to send data to a REST API
  • How to Intercept Request and Response of all API Calls in One Place

- Java services

  • Sending eMail using Java Service
  • Implementing Forgot Password feature using Java Service
  • Accessing REST APIs from Java Service
  • Scheduling a Java Service
  • Pre-Post Processing for Database Service APIs

- Variables

  • Using Filter Conditions on Variable
  • Using Live Variable APIs
  • Using Notification Actions
  • Using Navigation Action
  • Using Variables for Queries and Procedure
  • Using Service Variable in a Form
  • Using Filter Criteria for a Data and Live Widgets
  • Using Filter Criteria for a Database CRUD Variable

- JavaScript

  • Using JavaScript in Binding
  • Using JavaScript from External URL
  • Using JavaScript to loop a command

- Developer-side

  • Synchronizing WaveMaker Apps with IDEs Beta
  • Integrating Amazon Cognito for User Authentication
  • Integrating Sample Jasper Report in WaveMaker Application
  • How to generate PDF File using Jasper Reports
  • Upgrading an App from WaveMaker 9.x to WaveMaker 10.0
  • App Migration from WaveMaker 9x to 10x

Mobile Development

  • How-tos: Mobile Development

- Mobile gesture

  • Setting Swipe Gestures on a List Widget
  • Working with Pull to Refresh

- Mobile widgets

  • Using Search Widget within the Navbar

- Mobile UI design

  • Setting Splashscreen Images and App Icons
  • Using Cordova Plugins

Widgets

  • How-tos: Widgets

- Cards

  • Capturing Card Items

- DataTable

  • Customising Data Table Row Action
  • Using Widgets to represent Data Table Columns
  • View Master-Detail Data Records using Data Table
  • Add Master-Detail records using Data Table
  • Export Data from Data Table
  • Dynamic Data Tables
  • Data Table Column bound to Query
  • Custom Styling Data Table Columns & Rows

- List

  • Creating an Employee List grouped by City
  • Creating an Employee List grouped by Birth Month and City
  • OnRender Event
  • Including a Data Table within a List
  • Building an Editable List
  • Building Cascading Lists
  • Accessing List Items
  • Localization of Data Table Column Headings

- Forms

  • Using Live Form
  • Using Wizard for Cumulative Data Entry in a Form
  • Building Tabbed Live Form
  • How Tos: Live Form
  • Linking Live Form with another Widget for Input
  • Handling Related Fields in a Live Form
  • Adding Master-Detail records in the same transaction
  • Using Cascading Select & Autocomplete for Live Form Fields
  • Using Cascading Select within Live Form
  • Using cascading Filter to populate Live Form
  • Using Wizard for Master-Detail Live Form
  • Using Wizard for Progressive Data Entry in a Live Form
  • Using Wizard for Cumulative Data Entry in a Live Form

- Calendar

  • Calendar Usage - Create an Event
  • Calender Usage - Google Calendar Integration

- CheckboxSet

  • CheckboxSet to Filter List data

- FileUpload

  • File Upload Widget Operations
  • Upload File & Save in Database
  • File Upload & Blob Data
  • File Upload - Custom Directory
  • Accessing File Upload from Java Code
  • Upload Files from Live Form & Form

- Radioset

  • Radioset to Filter a List

- Rating

  • Building Rating Widget using Static Data
  • Building Rating Widget using Static Variable
  • Build Rating Widget using Model Variable
  • Building an Interactive Rating Widget

- Select

  • Configuring Select Widget from a Static List of Values
  • Configuring Select Widget from a Variable
  • Configuring Select Widget using Display and Data Fields
  • Configuring Select Widget from Database Fields
  • Configuring Cascading Select

- Charts

  • Charts - Displaying User Selection in another Widget
  • Charts - Handling Dynamic Data
  • Charts - Custom Data

- Live filter

  • Applying Live Filter to a Data Table or a Chart
  • Building a Multiple Selection Live Filter
  • Building a Range Live Filter

- Container

  • Setting partial page content for Accordion within a List
  • Setting partial page content for Panel within a List using JavaScript

- Tree

  • Tree Use Case - from Static Variable
  • Tree Use Case - from Java Service
  • Tree Use Case - Dynamic Tree

- Nav

  • Nav - Basic Usage

- Dropdown

  • Restricting menu item display based on user role
  • Implementing Localization for Dropdown Menu

Prefabs

  • How-tos: Prefabs
  • Create Prefab using Third Party UI Widgets
  • Create Prefab Using D3 & NVD3 Charts
  • Create Prefab Using D3 Library (DataMaps)
  • Create Prefab using JQuery Plugin
Edit

Setting Splashscreen Images and App Icons

A splash screen is a graphical control element, that usually appears while the app is launching. Icons and splashes are usually platform specific.

Setting Splashscreen Images & App Icons

For WaveMaker Hybrid Mobile Apps, splash screens and app icons for various devices can be edited and uploaded. You can set them from the Build dialog Note: Though the steps shown below are for Andriod Build, the process is same when using the Send to PhoneGap option for Build. In case of PhoneGap build, you will have the option to set images and icons for both iOS and Android platforms.

  1. From Project Actions, Build -> Build for Android option (you can also select the Send to PhoneGap option)
  2. In the build dialog, you will see the Splash screens and App Icons option under Android (and iOS, in case of PhoneGap) section
  3. On hover of the splash screen/ app icon, edit icon is shown.
  4. On click of the edit icon, the selected splash screen/icon is shown in the file tree.
  5. Upload a file and select the uploaded file in the tree. Click ‘Apply’ to apply the changes. (See the next sections for the splash screen image and icon requirements).
  6. Repeat for all the splash screens and icons.

Setting Splash Screen Images Requirements

Android Platform

Screen SizeDimensions
LandscapePotrait
------
LDPI320x200px200x320px
MDPI480x320px320x480px
HDPI800x480px480x800px
XHDPI1280x720px720x1280px
XXHDPI1600x960px960x1600px
XXXHDPI1280x1920px720x1280px

iOs Platform

DeviceDimensions
LandscapePotrait
------
Tablet (iPad)
Non-Retina (1x)1024x768px768x1024px
Retina (2x)2048x1536px1536x2048px
Handheld (iPhone, iPod)
Non-Retina (1x)480x320px320x480px
Retina (2x)960x640px640x960px
iPhone 5 Retina (2x)1136x640px640x1136px
iPhone 6 (2x)1334x750px750x1334px
iPhone 6 Plus (3x)1920x1080px1080x1920px

App Icon Dimensions

Android Platform

Screen SizeDimensions
XXXHDPI192px
XXHDPI144px
XHDPI96px
HDPI72px
MDPI48px
LDPI36px

iOS Platform

DeviceDimensions
iPhone57 px
iPad72 px
iPhone 4 Retina Display114 px
iPad 3 Retina Display144 px
iTunes*1024 px
iPhone Settings/Spotlight29 px
iPad Settings29 px
iPad Spotlight48 px
iPhone 4 Settings/Spotlight58 px
document icon64 px
document icon320 px

Mobile App Use Cases

  • 1. Setting Splashscreen Images & App Icons
    • i. Splashscreen Image Requirements
    • ii. App Icon Dimensions
  • 2. Using Cordova Plugin
Last updated on 9/11/2019 by rnaresh
← Barcode ScannerUsing Cordova Plugins →
  • Setting Splashscreen Images & App Icons
  • Setting Splash Screen Images Requirements
    • Android Platform
    • iOs Platform
  • App Icon Dimensions
    • Android Platform
    • iOS Platform
WaveMaker
  • PRICING
  • PARTNERS
  • CUSTOMERS
  • ABOUT US
  • CONTACT US
Terms of Use | Copyright © 2013-2019 WaveMaker, Inc. All rights reserved.