sgcJQueryMobile 1.3
Contents
1. Reference JQueryMobile JQuery Mobile is an easy way to build sites and apps that are accessible on all popular smartphone tablet and desktop devices The framework includes an Ajax navigation system that brings animated page transitions and a core set of UI widgets pages dialogs toolbars listviews buttons with icons form elements accordions collapsibles and more jQuery Mobile has broad support for the vast majority of all modern desktop smartphone tablet and e reader platforms More Information 23 License License eSeGeCe Components End User License Agreement eSeGeCe Components eSeGeCe End User License Agreement EULA is a legal agreement between you either an individual or a single entity and the Author of eSeGeCe for all the eSeGeCe components which may include associated software components media printed materials and online or electronic documentation eSeGeCe components By installing copying or otherwise using the eSeGeCe components you agree to be bound by the terms of this EULA This license agreement represents the entire agreement concerning the program between you and the Author of eSeGeCe referred to as LICENSER and it supersedes any prior proposal representation or understanding between the parties If you do not agree to the terms of this EULA do not install or use the eSeGeCe components The eSeGeCe components is protected by copyright laws and international copyr2. detect when user does a swipe to left or to right o Touch detect when user touch or touch tap hold e Built in navigation system including footer and header bars o ToolBar includes 2 buttons left and right with async on click support o Navigation Bar includes up to 5 buttons with built in standard icons async events and customized themes o SlidingPanels o ListViews e Built in Dialogs and PopUps o Dialogs customize custom Modal Dialogs o PopUp customize custom context menus e Compatible with mobile tablet e reader and desktop browsers o Apple OS Android BlackBerry Windows Phone Firefox Chrome Internet Explorer O 0O 0 O 30 O 0 0 0 00 O 2 e HTML Templates Support e Built in Themes support e Available JQueryMobile APIs o 1 2 sgcJQueryMobile 1 3 o 1 4 Overview Delphi Editions Delphi supported IDE Delphi 2007 Delphi 2009 Delphi 2010 Delphi XE Delphi XE2 Delphi XE3 Delphi XE4 Delphi XE5 Delphi XE6 Delphi XE7 Delphi XE8 Delphi 10 Seattle Free Version Compiled dcu files provided with free version are using default Intraweb version If you have upgraded any of these packets probably it won t work or you need to buy full source code version sgcJQueryMobile 1 3 History S Bug New EE N 1 3 Deleted Breaking changes 2015 October Added support for Rad Studio 10 Seattle Added support for Rad Studio XE8 Added support
3. for Rad Studio XE7 Fixed Bug Access Violation using Intraweb HTML Layout on 14 0 32 2014 July Added support for Rad Studio XE4 Added support for Rad Studio XE5 Added support for Rad Studio XE6 Added support to JQueryMobile 1 4 Fixed Intraweb Bug using Templates on version IW12 2 Fixed Intraweb XI Bug with Internet Explorer Browser Fixed Bug for Unicode Characters 1 1 2012 December Standard TIWGrid now is automatically enhanced reflow and toggle column support Added support for ListViews Added support for Dialogs Added support for PopUps Added support for SlidingPanels Added Delphi XE3 Support Upgraded to JQueryMobile 1 2 1 0 2012 May First Version Overview Installation 1 Unzip the files included into a directory DIR 2 From Delphi Add the directory where the files are unzipped DIR to the Delphi library pat under Tools Environment options Directories All Delphi C Builder Versions Add the directory DIR source to the library path For specific Delphi C Builder version Delphi 2007 Add the directory DIR libD2007 to the library path Delphi 2009 Add the directory DIR libD2009 to the library path Delphi 2010 Add the directory DIR libD2010 to the library path Delphi XE Add the directory DIR libDXE to the library path Delphi XE2 Add the directory DIR libDXE2 to the library path Delphi XE3 Add the directory
4. the eSeGeCe components as may be necessary for backup and archival purposes 2 DESCRIPTION OF OTHER RIGHTS AND LIMITATIONS a Maintenance of Copyright Notices You must not remove or alter any copyright notices on any and all copies of the eSeGeCe components b Distribution You may not distribute registered copies of the eSeGeCe components to third parties Evaluation editions available for download from the eSeGece official websites may be freely distributed You may create components ActiveX controls libraries which include the eSeGeCe components for your applications but you must NOT distribute or publish them to third parties c Prohibition on Distribution of SOURCE CODE Source editions only You must NOT distribute or publish the SOURCE CODE or any modification enhancement derivative works and or extensions in SOURCE CODE form to third parties You must NOT make any part of the SOURCE CODE be distributed published disclosed or otherwise made available to third parties d Prohibition on Reverse Engineering Decompilation and Disassembly You may not reverse engineer decompile or disassemble the eSeGeCe components except and only to the extent that such activity is expressly permitted by applicable law notwithstanding this limitation e Rental You may not rent lease or lend the eSeGeCe components f Support Services LICENSER may provide you with support services related to the eSeGeCe components S
5. D Delphi Editions 3 Dialog sanken 17 E Enhancers os la 10 H HISEOFV A ars aaa 4 I Installation ooooonncccccccnc os 5 INtrodUction coo 1 J JQueryMobile 23 L Layout HTML 9 ICONS it 25 LISTVIEW i 15 N NavBafsnn aan 14 0 Orientation EventS 20 P A a 18 S Salat aaa aaa 11 SlidePanel tt 16 T Tag EVENTS iii 21 Touch Events 19 TsgcIWJQMTemplate 7 30
6. DIR libDXE3 to the library path Delphi XE4 Add the directory DIR libDXE4 to the library path Delphi XE5 Add the directory DIR libDXE5 to the library path Delphi XE6 Add the directory DIR libDXE6 to the library path Delphi XE7 Add the directory DIR libDXE7 to the library path Delphi XE8 Add the directory DIR libDXE8 to the library path Delphi 10 Add the directory DIR libD10 to the library path 3 From Delphi sgcJQueryMobile 1 3 Choose File Open and browse Packages sgcJQueryMobile groupproj sgcJQueryMobileX dpk and dclsgcJQueryMobileX dpk packages files for Delphi sgcJQueryMobileD2007 groupproj sgcJQueryMobileD2009 groupproj sgcJQueryMobileD2010 groupproj sgcJQueryMobileDXE groupproj sgcJQueryMobileDXE2 groupproj sgcJQueryMobileDXE3 groupproj sgcJQueryMobileDXE4 groupproj sgcJQueryMobileDXE5 groupproj sgcJQueryMobileDXE6 groupproj sgcJQueryMobileDXE7 groupproj sgcJQueryMobileDXE8 groupproj sgcJQueryMobileD10 groupproj 4 Demos for the correct First compile then install Delphi 2007 Delphi 2009 Delphi 2010 Delphi XE Delphi XE2 Delphi XE3 Delphi XE4 Delphi XE5 Delphi XE6 Delphi XE7 Delphi XE8 Delphi 10 All demos are available in subdirectory Demos Just open the project and run it Intraweb demos may need to modify some units due to different Intraweb Versions Components TsgcIWJQMTemplate This is the Main component used to render JQueryMobile St
7. d it shows button e Active if enabled shows button as active e Icon select one of the list e IconPos select icon position centered no icon left e URL define url properties You can capture which button is selected using OnAsyncBarButtonClick Event procedure OnAsyncBarButtonClick Sender TObject Id string begin if Id sgcIWJQMHeaderBarLeftButtonURL then user selects Left Header Button else if Id sgcIWJQMHeaderBarLeftButtonURL then user selects Right Header Button 12 Components end 13 sgcJQueryMobile 1 3 TsgcIWJQMTemplate NavBar sgcJQueryMobile has a NavigationBar widget that is useful for providing up to 5 buttons with optional icons in a bar typically within a header or footer Enabled if enabled it shows navigation bar Position select where navigation bar is positioned header content or footer e Theme select one of the list Buttons Enabled if enabled it shows button e Active if enabled shows button as active e Icon select one of the list e IconPos select icon position centered no icon left e URL define url properties You can capture which button is selected using OnAsyncBarButtonClick Event procedure OnAsyncBarButtonClick Sender TObject Id string begin if Id sgcIWJQMHeaderNavBarButtonlURL then user selects First Header Button else if Id sgcIWJQMHead
8. d to any warranties of merchantability non infringement or fitness of a particular purpose LICENSER does not warrant or assume responsibility for the accuracy or completeness of any information text graphics links or other items contained within the eSeGeCe components LICENSER makes no warranties respecting any harm that may be caused by the transmission of a computer virus worm time bomb logic bomb or other such computer program LICENSER further expressiy disclaims any warranty or representation to Authorized Users or to any third party 6 LIMITATION OF LIABILITY In no event shall LICENSER be liable for any damages including without limitation lost profits business interruption or lost information rising out of Authorized Users use of or inability to use the eSeGeCe components even if LICENSER has been advised of the possibility of such damages In no event will LICENSER be liable for loss of data or for indirect special incidental consequential including lost profit or other damages based in contract tort or otherwise LICENSER shall have no liability with respect to the content of the eSeGeCe components or any part thereof including but not limited to errors or omissions contained therein libel infringements of rights of publicity privacy trademark rights business interruption personal injury and loss of privacy moral rights or the disclosure of confidential information 27 Index 29 B Da Sudan 12
9. erNavBarButton2URL then user selects Second Header Button end 14 Components TsgcIWJQMTemplate ListView Lists are used for data display navigation result lists and data entry so sgcJQueryMobile includes a wide range of list types and formatting examples to cover most common design patterns e Enabled if enabled it shows listview e Divider List items can be turned into dividers to organize and group the list items DividerTheme select one theme of the list e AutoDividers A listview can be configured to automatically generate dividers for its items the text used to create dividers is the uppercased first letter of the item s text e Header Header Customized Text Footer Footer Customized Text e Search adds a filter with a simple client side search feature e SearchTheme select one theme of the list e Read Only if enabled contents aren t linked e Items is a TStringList where you can put a simple title html text links You can capture user selected item using OnAsyncListViewClick procedure OnAsyncListViewClick Sender TObject Name string Item Integer begin if Item 0 then user selects first item else if Item 1 then user selects second item end 15 sgcJQueryMobile 1 3 TsgcIWJQMTemplate SlidePanel sgcJQueryMobile has a SlidingPanel widget that is useful for provide a Navigation Menu on the left or the right of the page Enabled if enabled
10. ight treaties as well as other intellectual property laws and treaties The eSeGeCe components is licensed not sold The eSeGeCe components is a freeware You may evaluate it for free and You can use the eSeGeCe components for commercial purpose If you want SOURCE CODE you need to pay the registration fee You must NOT give the license keys and or the full editions of eSeGeCe including the DCU editions and Source editions to any third individuals and or entities And you also must NOT use the license keys and or the full editions of eSeGeCe from any third individuals and or entities 1 GRANT OF LICENSE The eSeGeCe components is licensed as follows a Installation and Use LICENSER grants you the right to install and use copies of the eSeGeCe components on your computer running a validly licensed copy of the operating system for which the eSeGeCe components was designed e g Windows 95 Windows NT Windows 98 Windows 2000 Windows 2003 Windows XP Windows ME Windows Vista Windows 7 b Royalty Free You may create commercial applications based on the eSeGeCe components and distribute them with your executables no royalties required c Modifications Source editions only 25 sgcJQueryMobile 1 3 You may make modifications enhancements derivative works and or extensions to the licensed SOURCE CODE provided to you under the terms set forth in this license agreement d Backup Copies You may also make copies of
11. it shows sliding panel e Header Header Custom Text Message Footer Footer Custom Text Message e DisplayMode Panels can display in three different ways e Reveal The panel shifts the viewport over open partially obscuring part of the page when it pushes it out of view e Push The panel behaves just like pan at narrow widths but at wider viewports above 600 pixels the content re flows to make room for the panel so it can stay open permanently e Overlay The panel slides over the content like a standard menu To show SlidingPanel use these methods ShowLeftSlidePanel or ShowRightSlidePanel If you need to Close a Panel you can use CloseLeftSlidePanel or CloseRightSlidePanel 16 Components TsgcIWJQMTemplate Dialog Define custom Dialog Properties Enabled if true dialog is enabled e Title Title message e Text Body message e HeaderTheme select one theme of the list Applies to header dialog e ContentTheme select one theme of the list Applies to content dialog e NoCloseButton if true enables close button e Buttoni if defined first button text e Button2 if defined second button text e Button3 if defined third button text You can capture Button clicked by user using OnAsyncDialogClick it returns Button Text as a parameter procedure OnAsyncDialogClick Sender TObject Button String begin if Button Yes then SF user select yes button else if Button No the
12. n no select no button end 17 sgcJQueryMobile 1 3 TsgcIWJQMTemplate PopUp Here you can define a customized menu context Enabled if enabled shows popup e Text message text e Menu shows list view items If you want to show PopUp you must use ShowPopUp method Use ClosePopUp if you wan to close an opened PopUp 18 Components Events TsgcIWJQMTemplate Touch Events OnAsyncTouchTap Triggers after a quick complete touch event OnAsyncTouchTapHold Triggers after a held complete touch event OnAsyncTouchSwipe Triggers when a horizontal drag of 30px or more and less than 75px vertically occurs within 1 second duration OnAsyncTouchSwipeLeft Triggers when a swipe event occurred moving in the left direction OnAsyncTouchSwipeRight Triggers when a swipe event occurred moving in the right direction 19 sgcJQueryMobile 1 3 TsgcIWJQMTemplate Orientation Events 20 OnAsyncOrientationChange Triggers when a device orientation changes by turning it vertically or horizontally When bound to this event the callback function has one argument the event object The event object contains an orientation property equal to either portrait or landscape Components TsgcIWJQMTemplate Tag Events e OnCustomizeTag use this event to get more control about enhanced standard controls you can define Tag Properties Enhanced DataMini Datalnline Themes and if control is enhanced or not 21
13. nable FullScreen 11 sgcJQueryMobile 1 3 TsgcIWJQMTemplate Bar HeaderBar is a toolbar at the top of the page that usually contains the page title text and optional buttons positioned to the left and or right of the title for navigation or actions Headers can optionally be positioned as fixed so they remain at the top of the screen at all times instead of scrolling with the page FooterBar is very similar to the header in terms of options and configuration The primary difference is that the footer is designed to be less structured than the header to allow more flexibility so the framework doesn t automatically reserve slots for buttons to the left or right as it does in headers e Enabled if enabled it shows toolbar e Fixed enable in situations where the toolbar is a global navigation element you may want it to appear fixed so it doesn t scroll out of view Fullscreen works just like the fixed mode except that the toolbars overlay the page content rather than reserving a place in the document when not in fixed mode This is useful for immersive apps like photo or video viewers where you want the content to fill the whole screen and toolbars can be hidden or summoned to appear by tapping the screen Keep in mind that the toolbars in this mode will sit over page content so this is best used for specific situations e Text Text of the toolbar e Theme select one of the list Left Right Button Enabled if enable
14. nhance Intraweb Form Components TsgclWJQMTemplate Layout HTML When you want to customize the position of sgcIWJQueryMobile controls you must use a TIWTemplateProcessorHTML control and format custom HTML templates You only need to drop a TIWTemplateProcessorHTML control on your form assign to LayoutMgr property of the form and assign to LayoutHTML property of TsgcIWJQMTemplate Example if you have a form named FRMTest you need to create a file with FRMTest html and set Template Directory on ServerController Unit If you have 2 controls for example a grid and a button and you want to view first button called IWButton1 and then grid called IWGrid1 you need to define html template like this lt HTML gt lt HEAD gt lt HEAD gt lt BODY gt IWButton1 IWGrid1 lt BODY gt lt HTML gt Of course this is a very simple example and probably you will need to write more complex layouts if you need more information please refer to intraweb documentacion sgcJQueryMobile 1 3 Properties TsgcIWJQMTemplate Enhance This components allows to define properties to enhance standard Intraweb Components 10 Enable if true enhances standard intraweb components Datalnline By default all buttons in the body content are styled as block level elements so they fill the width of the screen However if you want a more compact control that is only as wide as the text and icons inside or If you have mul
15. sgcJQueryMobile 1 3 Table of Contents EAS ans anna 1 Delphi ECGS ee nee 3 Delphi supported ID Bes anschaue 3 Free Version sin 3 o O 4 SA e ai 5 TSOCIWIOM Te plate zn A leali 7 TsgcIWJQMTemplate Layout HTML i 9 Pr perties an sh 3 kes Se AA AUAA ENANA 10 TsgcIWJQMTemplate Enhance ii 10 TsgcIWJQMTemplate Safari iii 11 TsgcIWJQMTemplate Bar i 12 TsgcIWJQMTemplate NavBar L ii 14 TsgcIWJQMTemplate LIStVIEW Li 15 TsgcIWJQMTemplate SlidePanel iii 16 TsgcIWJQMTemplate Dialog ii 17 TsgcIWJQMTemplate POpUp i 18 Events aloe ea oi eroi 19 TsgcIWJQMTemplate Touch Events i 19 TsgcIWJQMTemplate Orientation Events eee 20 TsgcIWJQMTemplate Tag Events iii 21 TOUCHY MO DIG rai ld 23 A O AAE TEE ENNE 25 Introduction The component is designed to enhance WebPages made with Intraweb applying a JQueryMobile Template Features e Drop a component on your form and automatically will enhance standard intraweb components Enhance properties like Theme Inline controls or Mini view Standard Intraweb Components Supported o TIWEdit TIWComboBox TIWRadioButton TIWCheckBox TIWButton TIWMemo TIWGrid e Touch and Orientation Events support using Async Events o Orientation detect when device change to portrait or landscape o Swipe
16. tiple controls that should sit side by side on the same line enable this property DataMini if enabled creates a more compact version of controls Theme select one theme of the list TableBodyTheme select one theme of the list applies to body grid TableColumnPriority default priority of grid columns TableColumnToggle if enabled selectively hides columns at narrower widths as a sensible default but also offers a menu to let users manually control which columns they want to see This mode is better for financial data tables that have compact values and need to maintain comparisons across columns and rows of data It can also be used for building things like product comparison tables TableColumnText if not defined is Columns TableHeaderTheme select one theme of the list applies to header grid Components TsgcIWJQMTemplate Safari On this component you can set browser view properties Enabled if true enables custom properties e FullScreen the web application runs in full screen mode e IconURL default icon url e InitialScale The initial scale of the viewport as a multiplier The default is calculated to fit the webpage in the visible area PhoneDetection Enables or disables automatic detection of possible phone numbers in a webpage in Safari on iOS e Scalable if enabled user can zoom page otherwise it can t SplashScreenUrl image url e Style This property has no effect unless you first e
17. upport Services Any supplemental software code provided to you as part of the Support Services shall be considered part of the eSeGeCe components and subject to the terms and conditions of this EULA eSeGece is licensed to be used by only one developer at a time And the technical support will be provided to only one certain developer g Compliance with Applicable Laws You must comply with all applicable laws regarding use of the eSeGeCe components 3 TERMINATION Without prejudice to any other rights LICENSER may terminate this EULA if you fail to comply with the terms and conditions of this EULA In such event you must destroy all copies of the eSeGeCe components in your possession 26 License 4 COPYRIGHT All title including but not limited to copyrights in and to the eSeGeCe components and any copies thereof are owned by LICENSER or its suppliers All title and intellectual property rights in and to the content which may be accessed through use of the eSeGeCe components is the property of the respective content owner and may be protected by applicable copyright or other intellectual property laws and treaties This EULA grants you no rights to use such content All rights not expressly granted are reserved by LICENSER 5 NO WARRANTIES LICENSER expressly disclaims any warranty for the eSeGeCe components The eSeGeCe components is provided As Is without any express or implied warranty of any kind including but not limite
18. yles on Intraweb Forms You must drop this component on a form and that s all automatically renders all supported Intraweb Components to JQueryMobile Only drop ONE component on every Intraweb Form You can select which JQueryMobile API do you want to use e JQueryMobile 1 2 e JQueryMobile 1 4 This component has several Sub components like navigation bars list views dialogs all are grouped on Properties e Enhance custom properties to enhance standard Intraweb Components e Safari browser properties allowing full screen scalable splash screen images e HeaderBar header bar where you can define up to two buttons example home help title e FooterBar footer bar where you can define up to two buttons footer text e HeaderNavBar header navigation bar with up to five buttons usually used for navigation between pages e FooterNavBar footer navigation bar with up to five buttons usually used for navigation between pages HeaderListView header list view custom list view positioned on top of the page e FooterListView footer list view custom list view position on bottom of the page LeftSlidePanel left slide panel allowing to build custom navigation panels e RightSlidePanel right slide panel allowing to build custom navigation panels e Dialog build custom modal dialogs e PopUp build custom on context popups sgcJQueryMobile 1 3 e LayoutHTML used to customize html template after e
Download Pdf Manuals
Related Search