Introduction
Shopper is a QML based eBay app for Symbian and MeeGo devices. Supports browsing and searching products, view categories, item details, user detail, addition and removal in watch list.
It is aimed to be a fully feature eBay client for Symbian and MeeGo platform.
Features:
- Homescreen showing currently popular items, top selling products and most watched items arranged in tab layout.
- Category list showing a list of primary category for user selected site(India, US, UK, etc.) which can be clicked to show items of that particular category.
- Search – User can search items with a particularset of keywords.
- User account – Shopper need a user account setup to access all its features. It enables user to add and remove item from user watchlist, see user details and see user’s buying summary.
Shopper is built with a mixture of eBay’s Shopping, trading, finding & merchandising APIs with custom Qt/C++ wrapper written to access all API methods. Due to this reason, a vast number of features can be added in it in future.
Guidelines Compliance
Shopper is built complying all possible Symbian guidelines.
A back button is available on every view. Back button is disabled on categories, search & user view similar to Nokia store client. While on home view, back button closes the application.
User can add his/her eBay account to access all features of the application. Application will need to add account only once. If user doesn’t wish to add his/her account, the application will only able to search and view popular items. Only while removing an account, application will ask user twice. This attributes to non-threatening interface & design for Shopper.
For maximum utilization of screen real estate, toolbars and context menus are used. Simple and appropriate toolbar icons are used to show options on toolbar for consistent page navigation using pagestack.
Problems Faced
- List Heading/Page Heading
As ListHeading element provided in QtQuick 1.0 has a little lesser height than needed, a custom heading element was built. AN example is shown below
BorderImage { id: heading source: "qrc:/qml/symbian/images/listheader.svg" border { left: 28; top: 0; right: 28; bottom: 0 } anchors { top: parent.top left: parent.left right: parent.right } height: 60 smooth: true Row { anchors.fill: parent anchors.margins: 10 spacing: 10 Text { id: headingText anchors { left: parent.left leftMargin: 20 rightMargin: privateStyle.scrollBarThickness verticalCenter: parent.verticalCenter } text: "Shopper" color: "white" elide: Text.ElideRight style: Text.Outline styleColor: "#b3b3b3" font.pixelSize: platformStyle.fontSizeLarge+2 font.bold: true width: parent.width-parent.spacing-logoIcon.width } Image { id: logoIcon smooth: true source: "qrc:/qml/images/shopper.png" sourceSize.width: 32 sourceSize.height: sourceSize.width anchors.verticalCenter: parent.verticalCenter } } }
- Two way slider
As there is no two way slider available, it is being worked upon so that search filter view can be implemented. It is needed to filter prices for items.
Application Icon
Sceenshots
Source Nokia Developer Wiki