silk Ui;s 'Flip content' pattern

silk Ui;s 'Flip content' pattern

  

Hi Everyone,

          I wanted to ask something. Can I use silk UI pattern in already built simple mobile app? I wanted to use silk UI's  'flip content' pattern in my mobile app. How can I do that? Is there any documentation or what?


Cheers,

Hafsa

Are you saying that your existing app is not build on SilkUI?  There's an awful lot of CSS etc to that Flip Content pattern - it's amazing.  If your Mobile app is really simple, it might be easier to start a new app using SilkUI and then copy and paste your existing app controls etc into that.

Hi David,

My existing app is built in silk UI but I want it ot look like one of  silk UI pattern ' flip content.' My question is how can I do that? Will using css3 do that or do I have to use something else. 

Davidk wrote:

Are you saying that your existing app is not build on SilkUI?  There's an awful lot of CSS etc to that Flip Content pattern - it's amazing.  If your Mobile app is really simple, it might be easier to start a new app using SilkUI and then copy and paste your existing app controls etc into that.



Then you should be able to add the Flip Content widget to a Screen in your app.  You'll see that the widget is set up with 2 content sections... front and back.  Add content to those areas.

Flip is a web only pattern and you want to have it in a mobile app (as I understood).

No magical easy way I'm afraid. You can open WebPatterns and check out how FlipContent is built. Then you can rebuild it in your own mobile app/library. Most likely you'll need some JavaScript+CSS skills for that.

hafsa zaineb wrote:

Hi Everyone,

          I wanted to ask something. Can I use silk UI pattern in already built simple mobile app? I wanted to use silk UI's  'flip content' pattern in my mobile app. How can I do that? Is there any documentation or what?


Cheers,

Hafsa

Hi Hafsa,


You can manage dependencies of your mobile apps and add MobilePatterns there (you can find it on forge).

There you can find MobilePatterns >> Content >> FlipContent.


Cheers,

Lady

Hi everyone,

Thank you for the replies. What I got from all the replies that I can get flip content using a widget or from silk UI mobile patterns. I can flip the content using flash cards. I create flashcards and then make them work with the widget or through mobile patterns flip content. Am I write? Im searching for some documentation or an OML that could be of any help. Can I get that ? :)

Thank you 

hafsa.

Solution

FlipContent is also a Mobile Pattern... at least it is in 10.0.717.0.

From the Widgets Bar you can drag the Flip Content Widget onto a screen... and then set content into its Front and Back placeholders.

Solution

I just downloaded the latest version of Silk UI Mobile, and FlipContent is there - thanks for pointing that out, Davidk!

So, using it should be fairly easy. In recap:

  • Reference FlipContent (toolbar: Manage Dependencies) from the MobilePatterns module (if it's not already referenced in your mobile module).
  • Drag & drop MobilePatterns > Content > FlipContent to your screen. It will reveal a Front Side and Back placeholders.
  • Drag & drop whatever content you need into those placeholders.


I never had to do anything like your step 1.  I followed the process you outlined in step 2 and 3.  Glad you found it ok.

The Flip Content and Stacked Cards are 2 very cool widgets.  I don't know if that's React at play... but they are smooth... and impressive.