DrY Accordion component
hamishwillee
(Talk | contribs) m (Automated change of category from Web Runtime (WRT) to Symbian Web Runtime) |
hamishwillee
(Talk | contribs) m (Hamishwillee - Fix categories) |
||
| (3 intermediate revisions by one user not shown) | |||
| Line 1: | Line 1: | ||
| − | The Dry Accordion is not based on any previous component, but is completely new. It Though uses the Themes from Guarana & Theme-roller. | + | [[Category:Symbian Web Runtime]][[Category:UI]] |
| + | {{ArticleMetaData | ||
| + | |sourcecode=[[Media:DrY Accordion.zip]] | ||
| + | |installfile= <!-- Link to installation file (e.g. [[Media:The Installation File.sis]]) --> | ||
| + | |devices= <!-- Devices tested against - e.g. ''devices=Nokia 6131 NFC, Nokia C7-00'') --> | ||
| + | |sdk= <!-- SDK(s) built and tested against (e.g. [http://linktosdkdownload/ Nokia Qt SDK 1.1]) --> | ||
| + | |platform= <!-- Compatible platforms - e.g. Symbian^1 and later, Qt 4.6 and later --> | ||
| + | |devicecompatability= <!-- Compatible devices e.g.: All* (must have internal GPS) --> | ||
| + | |dependencies= <!-- Any other/external dependencies e.g.: Google Maps Api v1.0 --> | ||
| + | |signing=<!-- Signing requirements - empty or one of: Self-Signed, DevCert, Manufacturer --> | ||
| + | |capabilities=<!-- Capabilities required by the article/code example (e.g. Location, NetworkServices. --> | ||
| + | |keywords= <!-- APIs, classes and methods (e.g. QSystemScreenSaver, QList, CBase --> | ||
| + | |id= <!-- Article Id (Knowledge base articles only) --> | ||
| + | |language=<!-- Language category code for non-English topics - e.g. Lang-Chinese --> | ||
| + | |review-by=<!-- After re-review: [[User:username]] --> | ||
| + | |review-timestamp=<!-- After re-review: YYYYMMDD --> | ||
| + | |update-by=<!-- After significant update: [[User:username]]--> | ||
| + | |update-timestamp=<!-- After significant update: YYYYMMDD --> | ||
| + | |creationdate=20100516 | ||
| + | |author=[[User:Symbianyucca]] | ||
| + | }}The Dry Accordion is not based on any previous component, but is completely new. It Though uses the Themes from Guarana & Theme-roller. | ||
Following code snipped shows on how the According control can be used | Following code snipped shows on how the According control can be used | ||
| − | < | + | <code javascript> |
dojo.require("dry.Accordion"); | dojo.require("dry.Accordion"); | ||
| Line 30: | Line 50: | ||
var acc = new dry.Accordion({domIds: domIdsData2,styleTweaker: styleTweaker,expanded: expanded,collapsed: collapsed,}); | var acc = new dry.Accordion({domIds: domIdsData2,styleTweaker: styleTweaker,expanded: expanded,collapsed: collapsed,}); | ||
| − | </ | + | </code> |
The construction for the According takes domIds struct as a first argument, with this struct following variables can be defined: | The construction for the According takes domIds struct as a first argument, with this struct following variables can be defined: | ||
| Line 45: | Line 65: | ||
== Examples == | == Examples == | ||
| + | * Component browser at [http://dev.drjukka.com/DrY/ de.DrJukka.com/DrY/] | ||
| + | * WRT example at Wiki: [[:File:DrY Accordion.zip|DrY Accordion.zip]] | ||
| − | + | [[DrY Article Index|Go to DrY Index]] | |
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
| − | + | ||
Latest revision as of 06:47, 5 July 2012
Article Metadata
Code Example
Source file: Media:DrY Accordion.zip
Article
Created: symbianyucca
(16 May 2010)
Last edited: hamishwillee
(05 Jul 2012)
Following code snipped shows on how the According control can be used
dojo.require("dry.Accordion");
var domIdsData = [{
"id": "first one",
"toggle": "firstTogle",
"content": "firstContent",
"expanded":true,
"animated": true,
},{
"id": "second one",
"toggle": "secondTogle",
"content": "secondContent",
"expanded":false,
"animated": true,
"animDelay": 1500
}];
function expanded(id){
console.log(id + " expanded");
}
function collapsed(id){
console.log(id + " collapsed");
}
var acc = new dry.Accordion({domIds: domIdsData2,styleTweaker: styleTweaker,expanded: expanded,collapsed: collapsed,});
The construction for the According takes domIds struct as a first argument, with this struct following variables can be defined:
- "id": internal Id fort he According, used also as Title fort he Accordion,
- "toggle": Dom-ID name fort he div where the Accordion is to be placed in,
- "content": Dom-ID name fort he div where the Accordion collapsing is to be placed in,
- "expanded": true/false, defined initial collapsing state,
- "animated": true/false, identifies whether collapsing/expanding is done with animation,
- "animDelay": delay fort he collapsing/expanding animation.
The second argument is styleTweaker that would be used fort he themes, and expanded/ collapsed are callback functions to identify when the expanding/collapsing has finished.
Examples
- Component browser at de.DrJukka.com/DrY/
- WRT example at Wiki: DrY Accordion.zip

