app:widget
| Widget Name | appcelerator widget |
| Element | <app:widget> |
| Author | Mark Luffel |
| Homepage | http://www.appcelerator.org |
| Description | A widget that allows you to define other widgets. It's a MetaWidget! |
- Required Attributes (1)
- Optional Attributes (2)
- Examples (1)
- Source code
| Name | Type | Description | Default value |
|---|---|---|---|
| name | Tag Name | Full name of the widget.Any tag in the current document with this name will be template-replaced with the body of this tag. | Not specified |
| Name | Type | Description | Default value |
|---|---|---|---|
| required_params | Comma Separated Values | List of attribute names that must be added to the widget, comma-separated | Not specified |
| optional_params | Comma Separated Values | List of attribute names that may be added to the widget, comma-separated | Not specified |
Back to menuExample: Simple Example
Put anything you want in here
This content will be replaced by what was above
This is a simple example that uses the <app:widget>.
<app:widget name="app:my_widget"> Put anything you want in here </app:widget> <app:my_widget> This content will be replaced by what was above </app:my_widget>
1 /* 2 * This file is part of Appcelerator. 3 * 4 * Copyright (C) 2006-2008 by Appcelerator, Inc. All Rights Reserved. 5 * For more information, please visit http://www.appcelerator.org 6 * 7 * Appcelerator is free software: you can redistribute it and/or modify 8 * it under the terms of the GNU General Public License as published by 9 * the Free Software Foundation, either version 3 of the License, or 10 * (at your option) any later version. 11 * 12 * This program is distributed in the hope that it will be useful, 13 * but WITHOUT ANY WARRANTY; without even the implied warranty of 14 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the 15 * GNU General Public License for more details. 16 * 17 * You should have received a copy of the GNU General Public License 18 * along with this program. If not, see <http://www.gnu.org/licenses/>. 19 * 20 */ 21 22 23 Appcelerator.Widget.Widget = 24 { 25 getName: function() 26 { 27 return 'appcelerator widget'; 28 }, 29 getDescription: function() 30 { 31 /* Optional parameters that aren't set by the user get set to '' */ 32 return 'A widget that allows you to define other widgets. It\'s a MetaWidget!'; 33 }, 34 getVersion: function() 35 { 36 return 1.0; 37 }, 38 getSpecVersion: function() 39 { 40 return 1.0; 41 }, 42 getAuthor: function() 43 { 44 return 'Mark Luffel'; 45 }, 46 getModuleURL: function () 47 { 48 return 'http://www.appcelerator.org'; 49 }, 50 isWidget: function () 51 { 52 return true; 53 }, 54 getWidgetName: function() 55 { 56 return 'app:widget'; 57 }, 58 getActions: function() 59 { 60 return []; 61 }, 62 getAttributes: function() 63 { 64 var T = Appcelerator.Types; 65 return [{ 66 name: 'name', 67 optional: false, 68 type: T.pattern(/^[a-zA-Z_]+:[a-zA-Z_]+$/, 'Tag Name'), 69 description: 'Full name of the widget.'+ 70 'Any tag in the current document with this name will be template-replaced with the body of this tag.' 71 }, { 72 name: 'required_params', 73 optional: true, 74 type: T.commaSeparated, 75 description: 'List of attribute names that must be added to the widget, comma-separated' 76 }, { 77 name: 'optional_params', 78 optional: true, 79 type: T.commaSeparated, 80 description: 'List of attribute names that may be added to the widget, comma-separated' 81 }]; 82 }, 83 compileWidget: function(params) 84 { 85 }, 86 buildWidget: function(element,parameters) 87 { 88 var widgetName = parameters['name']; 89 var requiredParams = parameters['required_params']; 90 var optionalParams = parameters['optional_params']; 91 var widgetBody = Appcelerator.Compiler.getHtml(element); 92 var widgetTemplate = Appcelerator.Compiler.compileTemplate(widgetBody); 93 94 var attributes = []; 95 if (requiredParams) { 96 requiredParams = requiredParams.split(','); 97 for (var i = 0; i < requiredParams.length; i++) { 98 var name = requiredParams[i]; 99 attributes.push({ 100 name: name, 101 optional: false, 102 description: name 103 }); 104 } 105 } 106 if(optionalParams) { 107 optionalParams = optionalParams.split(','); 108 for(var i = 0; i < optionalParams.length; i++) { 109 var name = optionalParams[i]; 110 attributes.push({ 111 name: name, 112 optional: true, 113 description: name 114 }); 115 } 116 } else { 117 optionalParams = []; 118 } 119 120 var widget = { 121 isWidget: function() { 122 return true; 123 }, 124 getWidgetName: function() { 125 return widgetName; 126 }, 127 getActions: function() { 128 return []; 129 }, 130 getAttributes: function() { 131 return attributes; 132 }, 133 compileWidget: function() { 134 }, 135 buildWidget: function(element,parameters) { 136 // ignoring element body, maybe want a jsp-esque <insertBody/> tag 137 for (var i = 0; i < optionalParams.length; i++) { 138 var name = optionalParams[i]; 139 if (!parameters[name]) { 140 parameters[name] = ''; 141 } 142 } 143 return { 144 'presentation' : widgetTemplate(parameters), 145 'position' : Appcelerator.Compiler.POSITION_REPLACE, 146 'wire' : true, 147 'compile' : true, 148 'parent_tag' : 'none' 149 } 150 } 151 }; 152 153 Appcelerator.Widget.register(widgetName, widget, true); 154 return { 155 'position' : Appcelerator.Compiler.POSITION_REMOVE 156 }; 157 } 158 }; 159 160 Appcelerator.Widget.register('app:widget', Appcelerator.Widget.Widget); 161
Chapters
- Web Expressions (Interaction)
- Web Expressions (Visual)
- Web Expression Macros
-
Widget Reference
- app:as_flexflow
- app:box
- app:button
- app:calendar
- app:chart
- app:content
- app:datacache
- app:datatable
- app:download
- app:editinplace
- app:ext_grid
- app:ext_paging_grid
- app:ext_tree
- app:field
- app:folder
- app:graphical_music_player
- app:http
- app:if
- app:imagetransition
- app:iterator
- app:message
- app:modalbox
- app:modaldialog
- app:mp3player
- app:music_player
- app:pagination
- app:panel
- app:progressbar
- app:script
- app:search
- app:security
- app:shadowbox
- app:simple_panel
- app:statemachine
- app:stopwatch
- app:tabpanel
- app:template
- app:tooltip
- app:upload
- app:validation
- » app:widget
- app:yui_map
- CSS Helper Classes
- Advanced Configuration
- Debugging
- Forms
- Localization
- Interpolation
- Javascript Variables
- Javascript Functions
- Service Broker