PC SOFT

ONLINE HELP
FOR WINDEV, WEBDEV AND WINDEV MOBILE

Home | Sign in | English US
  • Overview
  • Sites for iPhone
  • Specific programming features
  • Tips
  • Test of a site page for Mobile
  • Sites for BlackBerry
  • Page layout
  • Specific buttons
  • Controls
WINDEV
WindowsLinuxUniversal Windows 10 AppJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadApple WatchUniversal Windows 10 AppWindows Mobile
Others
Stored procedures
Overview
WEBDEV allows you to develop sites for all types of devices: iPhone, BlackBerry, ... This page presents tips for optimizing the development of these sites.
Versions 17 and later
Note: WINDEV Mobile allows you to create applications for iPhone and iPad. See Developing an application for iPhone or iPad for more details.
New in version 17
Note: WINDEV Mobile allows you to create applications for iPhone and iPad. See Developing an application for iPhone or iPad for more details.
Note: WINDEV Mobile allows you to create applications for iPhone and iPad. See Developing an application for iPhone or iPad for more details.
Sites for iPhone
By default, the iPhone shows the sites in zoom-out mode to provide an overall view of the page. A page with standard dimensions looks like a stamp.
The size of the iPhone screen is 320 x 480. The useful size available for the applications is 320 x 256. The rest is used by the system menus.
To help you develop sites corresponding to the size of the screen, WEBDEV proposes to display the navigation size in the page ("Display .. Navigation size"). You have the ability to select the navigation size corresponding to the iPhone. See Navigation size for more details.
To specify to the iPhone that the size of the site is the expected one:
  1. Display the description of the page.
  2. Display the "Advanced" tab.
  3. In the "Devices" tab, select "Specific features of iPhone" and check "Generate the Safari navigation information for iPhone".
  4. Specify the following elements:
    • Width: Width of the device
    • Initial zoom: 100%
    • Height: Height of the device
Versions 15 and later
Specific features can also be taken into account:
  • Full-screen mode
    You have the ability to specify that a page of a site must be displayed in full-screen mode on the iPhone. To do so, check "Full screen" in the properties of the page ("Advanced" tab, "Devices" sub-tab, "Specific features of iPhone" section).
    In this case, you have the ability to choose the display mode of the status bar of Safari (the bar found at the top of the screen indicating the battery load, the time, etc.). The available options are as follows:
    • "Default": the bar is displayed with the default color
    • "Black": the bar is displayed with a black background
    • "Translucent black": the bar is displayed with a black background and a reduced opacity, the site is visible through the bar.
  • Application icon
    If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify an icon.
  • Splash Screen
    If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify a splash screen. This image must have a size of 320 by 460 pixels to be taken into account by the phone.
New in version 15
Specific features can also be taken into account:
  • Full-screen mode
    You have the ability to specify that a page of a site must be displayed in full-screen mode on the iPhone. To do so, check "Full screen" in the properties of the page ("Advanced" tab, "Devices" sub-tab, "Specific features of iPhone" section).
    In this case, you have the ability to choose the display mode of the status bar of Safari (the bar found at the top of the screen indicating the battery load, the time, etc.). The available options are as follows:
    • "Default": the bar is displayed with the default color
    • "Black": the bar is displayed with a black background
    • "Translucent black": the bar is displayed with a black background and a reduced opacity, the site is visible through the bar.
  • Application icon
    If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify an icon.
  • Splash Screen
    If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify a splash screen. This image must have a size of 320 by 460 pixels to be taken into account by the phone.
Specific features can also be taken into account:
  • Full-screen mode
    You have the ability to specify that a page of a site must be displayed in full-screen mode on the iPhone. To do so, check "Full screen" in the properties of the page ("Advanced" tab, "Devices" sub-tab, "Specific features of iPhone" section).
    In this case, you have the ability to choose the display mode of the status bar of Safari (the bar found at the top of the screen indicating the battery load, the time, etc.). The available options are as follows:
    • "Default": the bar is displayed with the default color
    • "Black": the bar is displayed with a black background
    • "Translucent black": the bar is displayed with a black background and a reduced opacity, the site is visible through the bar.
  • Application icon
    If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify an icon.
  • Splash Screen
    If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify a splash screen. This image must have a size of 320 by 460 pixels to be taken into account by the phone.
By default, the iPhone shows the sites in zoom-out mode to provide an overall view of the page. A page with standard dimensions looks like a stamp.
The size of the iPhone screen is 320 x 480. The useful size available for the applications is 320 x 256. The rest is used by the system menus.
To help you develop sites corresponding to the size of the screen:
  1. In the description window of the page, in the "General" tab, specify the target platform and the size of the screen:
    PlatformAvailable screen size
    Generic mobile
    • 240 x 320
    • 320 x 480
    • 480 x 640
    • 480 x 800
    This size can be customized.
    Apple mobile
    • iPad 3, iPad 4 (1536 x 2048)
    • iPad, iPad Mini (768 x 1024)
    • iPhone iPod Touch (320 x 480)
    • iPhone 4 (640 x 960)
    • iPhone 5 (640 x 1136)
    • iPhone 6 (750 x 1334)
    • iPhone 6 Plus (1080 x 1920)
    BlackBerry mobile
    • 240 x 320
    • 320 x 480
    • 360 x 480
    • 480 x 640
    • 480 x 800
  2. Display the "Advanced" tab.
  3. In the "Device" tab, the option "Generate the information about the navigation size and zoom (viewport)" is checked by default. This option allows you to use a generation adapted to the Safari browsers used on the iPhone. The specified values are filled by default and they can be modified
  4. Configure (if necessary) the specific features of the iPhone (specific WebApps iPhone features):
    • Full-screen mode
      You have the ability to specify that a page of a site must be displayed in full-screen mode on the iPhone.
      In this case, you have the ability to choose the display mode of the status bar of Safari (bar found at the top of the screen indicating the battery load, the time, etc.). The available options are as follows:
      • "Default": the bar is displayed with the default color
      • "Black": the bar is displayed with a black background
      • "Translucent black": the bar is displayed with a black background and a reduced opacity, the site is visible through the bar.
    • Versions 16 and later
      The address bar can be hidden or not.
      New in version 16
      The address bar can be hidden or not.
      The address bar can be hidden or not.
    • Application icon
      If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify an icon.
    • Splash Screen
      If a shortcut to the site is created on the home screen of the iPhone, you have the ability to specify a splash screen. This image must have a size of 320 by 460 pixels to be taken into account by the phone.

Specific programming features

The method for developing a site for iPhone is identical to the method for developing a standard site. Some programming features are specific to the development for iPhone.
You have the ability to make a phone call directly from a site: in the URL of the link used to make the phone call, specify "tel:" and the phone number.
For example:
// Phone
MAP_PHONE..URL = "phone:" + CUSTOMER.Phone
You also have the ability to display the Google Maps corresponding to the address of the customer directly from his form: in the URL of the link, specify "http://maps.google.com/maps?q=" followed by the address of the customer.
For example:
// Geo-localization
MAP_TGMAP..URL = "http://maps.google.com/maps?q=" + ...
URLEncode(Customer.Address + " " + Customer.City + ", " + Customer.Country)

Tips

  • Use the page templates specific to the iPhone.
  • Reduce the weight of the images found in the site. The large images, the Flash animations or the videos may slow down the time used to load the page.
  • Use the anchors to manage the different orientations of the iPhone.
Versions 16 and later

Test of a site page for Mobile

Depending on the type of the page, the test of the page is run in an environment representing the mobile device in the browser. For example:
You have the ability to click at the bottom of the page to check the change of orientation of the iPhone.
New in version 16

Test of a site page for Mobile

Depending on the type of the page, the test of the page is run in an environment representing the mobile device in the browser. For example:
You have the ability to click at the bottom of the page to check the change of orientation of the iPhone.

Test of a site page for Mobile

Depending on the type of the page, the test of the page is run in an environment representing the mobile device in the browser. For example:
You have the ability to click at the bottom of the page to check the change of orientation of the iPhone.
Sites for BlackBerry
The BlackBerry is also a mobile phone allowing you to manage your emails among other things. It also allows you to access the Web pages. The use of Web sites for BlackBerry is mainly intended for consultation and basic forms. The browser of the BlackBerry is intended for low bandwidth and therefore some constraints must be complied with.
To help you develop sites corresponding to the size of the screen, WEBDEV proposes to display the navigation size in the page ("Display .. Navigation size"). You have the ability to select the navigation size corresponding to the BlackBerry. See Navigation size for more details.To help you develop sites corresponding to the size of the screen, in the description window of the page, in the "Details" tab, specify the target platform "Mobile BlackBerry" and the size of the screen:
  • 240 x 320
  • 320 x 480
  • 480 x 640
  • 680 x 800

Page layout

The BlackBerry does not directly apply the page layout defined in the project. The controls are automatically resized and they are aligned one below each other on the side of the page to allow a vertical navigation perfectly suited for this type of device.
Therefore, we advise you to design "vertical" pages in order to respect the operating mode of the browser.

Specific buttons

In order for the buttons to have a standard operating mode on a browser:
  1. Display the description of the page.
  2. Display the "Advanced" tab.
  3. In the "Devices" tab, select "Specific features of BlackBerry" and check "Generate the text buttons adapted to BlackBerry".In the "Device" tab, check "Generate the text buttons adapted to BlackBerry".

Controls

The sites for BlackBerry can have a single button per page and this button must be a "submit" button: it returns a value to the server.
The controls supported by the BlackBerry are as follows:
  • some buttons (text buttons recommended)
  • the captions
  • the links
  • the images
  • the check boxes
  • the radio buttons
  • the list boxes and combo boxes
  • the edit controls
Minimum required version
  • Version 12
Comments
Click [Add] to post a comment