×

Discussion Board

Results 1 to 5 of 5

Hybrid View

  1. #1
    Registered User
    Join Date
    Feb 2011
    Posts
    62

    Lightbulb Creating slick app interfaces using Qt Quick

    Hello all,

    I've got some experience coding Qt & QML but not a huge amount (C# is my thing). I'm trying to implement an app interface similar to that of Nokia Situations (i.e. tap 'At home', the screen fades and slides to the left, revealing new buttons), how would I do this?

    Do I create a large canvas as a base state, then shift it to the left and change the opacity of the controls using QML transitions?

    Any tips and/or advice appreciated!

    Infms


  2. #2
    Super Contributor
    Join Date
    Jun 2006
    Location
    India
    Posts
    3,037

    Re: Creating slick app interfaces using Qt Quick

    fading can be display by opacity and sliding can be done using animation. Check qml example, you will get lots of sample.
    Use [URL="http://qt.nokia.com/products/qt-quick/"]Qt-Quick[/URL] to make your application UI more attractive.

    [URL="http://store.ovi.com/content/271896"]http://store.ovi.com/content/271896[/URL] | [URL="http://store.ovi.com/content/276199"]http://store.ovi.com/content/276199[/URL] |[URL="http://store.ovi.com/content/276202"] http://store.ovi.com/content/276202[/URL] | [URL="http://store.ovi.com/content/280827"]http://store.ovi.com/content/280827[/URL]

  3. #3
    Registered User
    Join Date
    Feb 2011
    Posts
    62

    Re: Creating slick app interfaces using Qt Quick

    Thanks for the reply, kkrish. I thought this is how it might be done. So it's possible to have a canvas larger than the screen resolution. This canvas is then shifted around using animations, revealing new controls? I'll definitely take a look at the QML examples.

  4. #4
    Registered User
    Join Date
    May 2009
    Location
    Greece
    Posts
    191

    Re: Creating slick app interfaces using Qt Quick

    The above application is written with Qt Quick components for Symbian. This means that you can use them only if you are targeting Symbian platform (or Meego). If you are targeting at other platform then yes you need to create them yourself or use Qt Quick Colibri project.

    Now a few things for the above video.
    All the transitions that you see (fade out, slide, etc.) are caused from that components, you don't have to write them yourself.
    The slide of the view to the left when a list item is selected is caused from the PageStack component. You have different Pages that containing your different views. Upon pushing to the PageStack a new Page, the new Pages is at the top of the stack so automatically the views will slide to the left hiding the old and revealing the new. Note here that you don't have to have all the Pages that you can possibly show preloaded upon startup. A Page can be created just before its showing and will be deleted when the PageStack is poped (this is a comment on your saying " So it's possible to have a canvas larger than the screen resolution").

    The revealing of the new buttons is a simple concept: you have a Rectangle containing a toggle Button at the top and below what you want to show. Then when you bind the size of the Rectangle with the state of the Button. When the Button is not pressed, the size of the Rectangle equals to the size of the Button. When the Button is pressed the size of the Rectangle is the height of the Button plus the height of the components that you want to show. Also at the height property you will add a Behavior so that when it changes it will be animated. Now you have a sliding component showing and hiding things you want.

    Well i can keep talking and talking. Take a look at those, if you have any question we will be happy to help.

  5. #5
    Registered User
    Join Date
    Feb 2011
    Posts
    62

    Re: Creating slick app interfaces using Qt Quick

    Hi favoritas,

    A belated thank-you for your detailed reply, it makes perfect sense. Qt Quick components for Symbian does a great job at making controls and transitions look pleasing – just what I was looking for.

    Cheers

Similar Threads

  1. Creating New Qt Quick Application has some issue on New Qt SDK 1.1 TP
    By chintandave_er in forum [Archived] Qt SDKs and Tools
    Replies: 2
    Last Post: 2011-01-30, 17:14
  2. Use different interfaces in the same time
    By Cartouche67100 in forum Wired and Wireless interfaces (Closed)
    Replies: 0
    Last Post: 2009-04-14, 14:10
  3. How to write the interfaces
    By sriramadasu in forum Symbian
    Replies: 6
    Last Post: 2006-09-06, 06:34
  4. Voice via interfaces other than bluetooth
    By yippyman in forum Symbian
    Replies: 0
    Last Post: 2002-12-09, 22:01

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
×