NightFlash LED flashlight in QML - app showcase

Night Flash is a LED flash light tool written using Qt Quick Components. This article explains the main elements of the app design.

Article Metadata

---

Code Example

Installation file: http://store.ovi.com/content/234198

---

Tested with

Devices(s): Nokia 700/701/C6-01/C7-00/Oro/X7-00/E6-00

---

Article

Created: jacky.finalfantasy (14 Mar 2012)

Last edited: hamishwillee (20 Apr 2012)

Introduction

Hi, I am Jacky (a device driver engineer). I want to write a APP about using phone's LED flash light. I am not familiar to create beautiful UI, so I need a tool to help me quickly to build a suitable UI. Few month ago, I find QML language and it is very easy to let me design the UI. I start to use QML to finish my Night Flash APP UI, and use C++ (QDeclarativeItem) to finish the logic and LED control.

Night Flash is a LED flash light tool. (QML UI + C++ code with QDeclarativeItem. StatusBar + PageStack + ToolBar)

App Overview

Four function pages let you easy to use different LED function. (mainPage create TabBar/TabGroup with 4 Page)

Provide toolbar and menu to select other Page. ( 1. ToolBarLayout/ToolButton to create toolbar menu select in mainPage. 2. Menu/MenuLayout/MenuItem to create the menu-item that can be clicked).

Support shake phone or press volume-key to enable/disable LED function.

1. C++ part get the phone-shake or volume-key press, and then send a signal to QML UI.
2. The shakeModeSettingPage/volumeKeySettingPage height is larger than phone's height pixels, but you can use Flickable component to let it be flickable.

• 

  Basic Page

• 

  Adjust Page

• 

  SOS Page

• 

  Remain Page

• 

  shake Mode Settings Page

• 

  Volume Key Settings Page

Custom components instead

I almost use the Qt Quick Components. Only a few specific images that need be re-created/re-modified. For example ShakeModeImage/VolumeKeyImage: when user press this icon, change the background image to blue and give a ThemeEffect (Let it fit the similar Qt Quick Components.)

Problem areas

1. The four tab-pages need fill with black Rectangle. If use Item instead, seems sometimes have ghost-image.
2. I want to get the Slider press-release event. Slider send onValueChanged signal every time when value changed, but I want to get the final value when press-release. I add MouseArea outside. MouseArea do the following thing to get
   1. drag.filterChildren: true
   2. check onCanceled and onPositionChanged signal.
3. I use 4 tab-pages, so the APP startup seems slowly. Maybe need more powerful hardware with GPU support?!

Get Night Flash from Nokia Store

Only works for Nokia Belle. (Nokia 700/701/C6-01/C7-00/Oro/X7-00/E6-00):

• Fixed web browser: http://store.ovi.com/content/234198
• Nokia mobile browser: http://store.ovi.mobi/content/234198

Note: This is an entry in the Symbian Qt Quick Components Competition 2012Q1