Jump to content

All Activity

This stream auto-updates     

  1. Past hour
  2. Onclick failure when switching TW3Editbox on iOS.

    @jarto I can't recreate Bug #1 anymore
  3. Today
  4. [2.9.9.67] TW3 Components event CSS handlers

    Added a video showing difference between tapping and clicking on Bug 2
  5. Hi, Bug #1 - tw3panel vs tw3button I've encountered a discrepancy with how the css is applied to different components. In this example the :active selector in the css doesn't work on the button but does work for other selectors like :hover. :active also works on tw3panel for example. :active -> green :hover -> red normal -> blue Bug #2 - toggle button As a work around of not being able to use :selected in the past I was using two css classes and switching the StyleClass of the component onClick to create essentially a Toggle Button. This has now broken for some reason in the latest patch on android but not iOS devices. The android issue can be recreated on a computer as well using the demo link and chrome mobile dev tools. It seems to be that to get the onclick to fire properly and switch the css as intended one must hold down on the button for some time, tapping doesn't work, this is not an issue on iOS or Desktop use. An example of the onclick: procedure TNWToggleButton.CheckBoxClick(Sender: TObject); begin // sets css class and checked boolean to Mark toggle status if TNWToggleButton(Sender).Checked then begin // On TNWToggleButton(Sender).StyleClass := OffCssClass; Checked := False; end else begin TNWToggleButton(Sender).StyleClass := OnCssClass; // Off Checked := True; end; end; Please also let me know if there is a better way of achieving what i'm trying to do here. Demo Source
  6. CSS Theming issues

    update if css is switched to iOS.css then the border on TW3IFrameHTMLElement does work (i.e., it disappears). TWImage still shows border.
  7. Working with css, how to

    I just explained how it should be handled. And css is cascading, meaning that you define both for webkit, ffox etc. in the same file - you dont need the browserprefix in a static file. Just put it in a css file, add it as a resource and then load it in using TW3Storage functions.
  8. CSS Theming issues

    Drop a panel on a form - set ThemeBorder to btNone and - no border - excellent Drop TW3Image or TW3IFrameHTMLElement and do the same and you continue to have a border displayed. Even if I try to add in CSS to the custom css file I continue to see borders around these components. It is driving me to distraction.
  9. Alpha 2.9.9.59 InsertRule CSS Error

    See link for best practice implementation of css injection.
  10. Smart RTTI raises an AV

    Open the project "SMS_INSTALL_DIR\Projects\Featured Demos\System\RTTI\RTTI.sproj", and compile it. Ensure when you compile a project with RTTI features enabled: Project Options ---> Compiler ---> Code Generation ---> [x] Emit RTTI information in the first compile, the compiler spits no error. If you try to compile the project again, you've got a nasty message with AV [INFO] Building project 'RTTI'... [INFO] Compilation successful [250 ms] [INFO] Generating JavaScript... Compilation failed [Failed to build project: Internal error. Code-generator threw exception EAccessViolation with message Access violation at address 007EA986 in module 'smartms.exe'. Read of address 00000000] error if you execute/run the project you've got that terrible ghost black screen. more details at:
  11. Onclick failure when switching TW3Editbox on iOS.

    Sorry Jarto, only just woken up - we will post some code today
  12. Working with css, how to

    We do know, this could easily break the application, and it is difficult to find the source. Does anyone know a better approach to inject CSS with multiple rules? procedure InsertCSS; begin { ╔════════════════════════════════════════════════════════╗ ║ insert here the component stylesheet (generated code) ║ ╚════════════════════════════════════════════════════════╝ } var returnCSS: array of string = [ 'html, body { position: relative; height: 100%; width: 100%; }', 'body { font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0px; padding: 0px; color: rgb(0, 0, 0); font-size: 14px; line-height: 1.35; width: 100%; background-color: rgb(255, 255, 255); overflow: hidden; background-position: initial initial; background-repeat: initial initial; }', '* { '+BrowserAPI.PrefixDef("")+'tap-highlight-color: rgba(0, 0, 0, 0); }', 'a, input, textarea, select { outline: 0px; }', 'a { text-decoration: none; color: rgb(0, 122, 255); }', 'p { margin: 1em 0px; }', '.modal .preloader { width: 34px; height: 34px; }', '.modal-overlay, .preloader-indicator-overlay, .popup-overlay, .picker-modal-overlay { position: absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.4); z-index: 10000; visibility: hidden; opacity: 0; transition: 400ms; '+BrowserAPI.PrefixDef("")+'transition: 400ms; background-position: initial initial; background-repeat: initial initial; }', '.modal-overlay.not-animated, .preloader-indicator-overlay.not-animated, .popup-overlay.not-animated, .picker-modal-overlay.not-animated { transition: 0ms; '+BrowserAPI.PrefixDef("")+'transition: 0ms; }', '.modal-overlay.modal-overlay-visible, .preloader-indicator-overlay.modal-overlay-visible, .popup-overlay.modal-overlay-visible, .picker-modal-overlay.modal-overlay-visible { visibility: visible; opacity: 1; }', '.picker-modal-overlay { z-index: 12000; }', '.popup-overlay { z-index: 10500; }', '.preloader-indicator-overlay { visibility: visible; opacity: 0; background-image: none; background-position: initial initial; background-repeat: initial initial; }', '.preloader-indicator-modal { position: absolute; left: 50%; top: 50%; padding: 8px; margin-left: -25px; margin-top: -25px; background-color: rgba(0, 0, 0, 0.8); z-index: 13500; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; background-position: initial initial; background-repeat: initial initial; }', '.preloader-indicator-modal .preloader { display: block; width: 34px; height: 34px; }', '.modal { width: 270px; position: absolute; z-index: 11000; left: 50%; margin-left: -135px; margin-top: 0px; top: 50%; text-align: center; opacity: 0; '+BrowserAPI.PrefixDef("")+'transform: translate3d(0%, 0%, 0px) scale(1.185); '+BrowserAPI.PrefixDef("")+'transition: '+BrowserAPI.PrefixDef("")+'transform, opacity; transition: '+BrowserAPI.PrefixDef("")+'transform, opacity; color: rgba(190, 224, 247, 0.901961); text-shadow: rgba(0, 0, 0, 0.498039) 0px -0.08em 0px; border: 0.15em solid rgb(25, 133, 208); border-top-left-radius: 0.3em; border-top-right-radius: 0.3em; border-bottom-right-radius: 0.3em; border-bottom-left-radius: 0.3em; '+BrowserAPI.PrefixDef("")+'box-shadow: rgba(0, 0, 0, 0.8) 0px 0.2em 0.6em; box-shadow: rgba(0, 0, 0, 0.8) 0px 0.2em 0.6em; background-image: none; background-color: rgb(3, 17, 26); }', '.modal.modal-in { opacity: 1; transition: 400ms; '+BrowserAPI.PrefixDef("")+'transition: 400ms; '+BrowserAPI.PrefixDef("")+'transform: translate3d(0%, 0%, 0px) scale(1); }', '.modal.modal-out { opacity: 0; z-index: 10999; transition: 400ms; '+BrowserAPI.PrefixDef("")+'transition: 400ms; '+BrowserAPI.PrefixDef("")+'transform: translate3d(0%, 0%, 0px) scale(0.815); }', '.modal-inner { padding: 15px; border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: rgb(181, 181, 181); border-top-left-radius: 7px; border-top-right-radius: 7px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; }', '.modal-title { font-weight: 500; font-size: 18px; text-align: center; }', '.modal-title + .modal-text { margin-top: 5px; }', '.modal-title + .preloader { margin-top: 5px; }', '.modal-buttons { height: 44px; overflow: hidden; display: flex; justify-content: center; }', '.modal-button { width: 100%; padding: 0px 5px; height: 44px; font-size: 17px; line-height: 44px; text-align: center; color: rgb(0, 122, 255); display: block; position: relative; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; cursor: pointer; box-sizing: border-box; border-right-width: 1px; border-right-style: solid; border-right-color: rgb(181, 181, 181); }', '.modal-button:first-child { border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 7px; }', '.modal-button:last-child { border-right-style: none; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 7px; border-bottom-left-radius: 0px; }', '.modal-button:first-child:last-child { border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px; }', '.modal-button.modal-button-bold { font-weight: 600; }', '.modal-button:active { background-color: rgb(17, 89, 140); background-image: '+BrowserAPI.PrefixDef("")+'linear-gradient(top, rgb(25, 133, 208), rgb(20, 104, 162) 3%, rgb(14, 75, 117)); }', '.modal-no-buttons .modal-inner { border-top-left-radius: 7px; border-top-right-radius: 7px; border-bottom-right-radius: 7px; border-bottom-left-radius: 7px; border-bottom-style: none; }', '.modal-no-buttons .modal-buttons { display: none; }', '.actions-modal { position: absolute; left: 0px; bottom: 0px; z-index: 11000; width: 100%; '+BrowserAPI.PrefixDef("")+'transform: translate3d(0%, 100%, 0px); }', '.actions-modal.modal-in { transition: 300ms; '+BrowserAPI.PrefixDef("")+'transition: 300ms; '+BrowserAPI.PrefixDef("")+'transform: translate3d(0%, 0%, 0px); border-top-width: 1px; border-top-style: solid; border-top-color: rgb(3, 5, 7); background-color: rgba(0, 0, 0, 0.901961); background-image: linear-gradient(rgba(50, 74, 103, 0.901961), rgba(12, 17, 24, 0.901961) 2%, rgba(0, 0, 0, 0.901961)); }', '.actions-modal.modal-out { z-index: 10999; transition: 300ms; '+BrowserAPI.PrefixDef("")+'transition: 300ms; '+BrowserAPI.PrefixDef("")+'transform: translate3d(0%, 100%, 0px); }', '.actions-modal-group { margin: 8px; '+BrowserAPI.PrefixDef("")+'background-clip: padding; background-clip: padding-box; border-top-left-radius: 0.4em; border-top-right-radius: 0.4em; border-bottom-right-radius: 0.4em; border-bottom-left-radius: 0.4em; }', '.actions-modal-button { width: 100%; text-align: center; font-size: 20px; font-weight: normal; margin: 0px 0px 0.2em; cursor: pointer; box-sizing: border-box; display: block; border-width: 0.1em; border-style: solid; border-color: rgb(166, 166, 166) rgb(153, 153, 153) rgb(153, 153, 153); color: black; text-shadow: rgba(255, 255, 255, 0.247059) 0px 0.08em 0px; '+BrowserAPI.PrefixDef("")+'box-shadow: rgba(255, 255, 255, 0.0980392) 0px 0.1em 0px; background-color: rgb(204, 204, 204); background-image: linear-gradient(rgb(255, 255, 255), rgb(222, 222, 222) 2%, rgb(186, 186, 186)); min-height: 1.8em; padding: 0.3em 0.6em; background-position: initial initial; background-repeat: initial initial; }', '.actions-modal-button a { text-decoration: none; color: inherit; }', '.actions-modal-button b { font-weight: 500; }', '.actions-modal-button.actions-modal-button-bold { font-weight: 500; }', '.actions-modal-button.actions-modal-button-red { color: white; background-color: rgb(199, 5, 5); background-image: linear-gradient(rgb(251, 106, 106), rgb(234, 6, 6) 2%, rgb(164, 4, 4)); }', '.actions-modal-button:first-child { border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; }', '.actions-modal-button:last-child { border: none; border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; }', '.actions-modal-button:first-child:last-child { border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; }', '.actions-modal-button:active { background-color: rgb(220, 220, 220); background-position: initial initial; background-repeat: initial initial; }', 'input.modal-prompt-input { box-sizing: border-box; height: 30px; background-color: rgb(255, 255, 255); margin: 15px 0px 0px; padding: 0px 5px; border: 1px solid rgb(160, 160, 160); border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; width: 100%; font-size: 14px; font-family: inherit; display: block; box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px; '+BrowserAPI.PrefixDef("")+'appearance: none; background-position: initial initial; background-repeat: initial initial; }', 'input.modal-text-input { box-sizing: border-box; height: 26px; background-color: rgb(255, 255, 255); margin: 15px 0px 0px; padding: 0px 5px; border: 1px solid rgba(0, 0, 0, 0.298039); border-top-left-radius: 0px; border-top-right-radius: 0px; border-bottom-right-radius: 0px; border-bottom-left-radius: 0px; width: 100%; font-size: 14px; font-family: inherit; display: block; box-shadow: rgba(0, 0, 0, 0) 0px 0px 0px; '+BrowserAPI.PrefixDef("")+'appearance: none; background-position: initial initial; background-repeat: initial initial; }', 'input.modal-text-input + input.modal-text-input { margin-top: 5px; }', '.modal-input-double + .modal-input-double input.modal-text-input { border-top-width: 0px; margin-top: 0px; }', '.preloader { display: inline-block; width: 20px; height: 20px; background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D\"0%200%20120%20120\"%20xmlns%3D\"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\"%20xmlns%3Axlink%3D\"http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink\"%3E%3Cdefs%3E%3Cline%20id%3D\"l\"%20x1%3D\"60\"%20x2%3D\"60\"%20y1%3D\"7\"%20y2%3D\"27\"%20stroke%3D\"%236c6c6c\"%20stroke-width%3D\"11\"%20stroke-linecap%3D\"round\"%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".27\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".27\"%20transform%3D\"rotate(30%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".27\"%20transform%3D\"rotate(60%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".27\"%20transform%3D\"rotate(90%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".27\"%20transform%3D\"rotate(120%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".27\"%20transform%3D\"rotate(150%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".37\"%20transform%3D\"rotate(180%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".46\"%20transform%3D\"rotate(210%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".56\"%20transform%3D\"rotate(240%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".66\"%20transform%3D\"rotate(270%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".75\"%20transform%3D\"rotate(300%2060%2C60)\"%2F%3E%3Cuse%20xlink%3Ahref%3D\"%23l\"%20opacity%3D\".85\"%20transform%3D\"rotate(330%2060%2C60)\"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); background-size: 100%; '+BrowserAPI.PrefixDef("")+'animation: preloader-spin 1s steps(12, end) infinite; background-position: 50% 50%; background-repeat: no-repeat no-repeat; }', '@'+BrowserAPI.PrefixDef("")+'keyframes preloader-spin {100% { '+BrowserAPI.PrefixDef("")+'transform: rotate(360deg); }}' ]; for var i:= returnCSS.low to returnCSS.high do begin BrowserAPI.Document.styleSheets[0].insertRule( returnCSS[i], i); end; end; initialization InsertCSS;
  13. RTTI metadata only for some classes

    RTTI Demo RTTI INFO
  14. RTTI metadata only for some classes

    Let's line back to see what's happening: Smart Mobile Studio supports RTTI, it allow you enum methods, properties, extract type information, but unfortunately since version > v2.0 it seems this feature is broken. I Remember in the past, I think in the 1st version( v1.2) this features were working as expected. Open the project "SMS_INSTALL_DIR\Projects\Featured Demos\System\RTTI\RTTI.sproj", and compile it. When you compile a project with RTTI features enabled: Project Options ---> Compiler ---> Code Generation ---> [x] Emit RTTI information in the first compile, the compiler spits no error. If you try to compile the project again, you've got a nasty message with AV [INFO] Building project 'RTTI'... [INFO] Compilation successful [250 ms] [INFO] Generating JavaScript... Compilation failed [Failed to build project: Internal error. Code-generator threw exception EAccessViolation with message Access violation at address 007EA986 in module 'smartms.exe'. Read of address 00000000] error if you execute/run the project you've got that terrible ghost black screen. So, I try to investigate the issue again. The compiler emit an array of objects $RTTI ( around 76kb ) this variable contain numerous (unwanted) metadata, too many unwanted methods, properties and fields being emitted in the RTTI info block in the main javascript output. The idea I would like to use RTTI and avoid exposing everything. Due to the fact that the default visibility for all properties in classes is "published", declaring properties in classes without any visibility leads to unwanted objects in the $RTTI. Around the SMS RTL, we have enumerous classes without any visibility, there are a bunch of external classes with no explicit visibility. We have to include explicitly the public visibility to those classes. $SMS_INSTALL_DIR\rtl\APIs\ECMA\ECMA.Date.pas type JDate = class external 'Date' public ------------------------------------ $SMS_INSTALL_DIR\rtl\APIs\ECMA\ECMA.Math.pas JMath = class external 'math' public ------------------------------------ $SMS_INSTALL_DIR\rtl\APIs\ECMA\ECMA.RegEx.pas type JRegExp = class external 'RegExp' public ------------------------------------ $SMS_INSTALL_DIR\rtl\System\System.Types.pas TJsMath = class external "Math" public ------------------------------------ $SMS_INSTALL_DIR\rtl\SmartCL\SmartCL.Effects.pas TW3MovableControl = partial class(TW3TagContainer) public ------------------------------------ $SMS_INSTALL_DIR\rtl\APIs\W3C\W3C.SVG1.pas JSVGLength = class external 'SVGLength' public const JSVGAngle = class external 'SVGAngle' public const JSVGColor = class external 'SVGColor' (JCSSValue) public const JSVGUnitTypes = class external 'SVGUnitTypes' public const JSVGTransform = class external 'SVGTransform' public const JSVGPreserveAspectRatio = class external 'SVGPreserveAspectRatio' public const JSVGZoomAndPan = class external 'SVGZoomAndPan' public const JSVGRenderingIntent = class external 'SVGRenderingIntent' public const JSVGPathSeg = class external 'SVGPathSeg' public const JSVGTextContentElement = class external 'SVGTextContentElement' (JSVGElement) public const JSVGTextPathElement = class external 'SVGTextPathElement' (JSVGTextContentElement) public const JSVGPaint = class external 'SVGPaint' (JSVGColor) public const JSVGMarkerElement = class external 'SVGMarkerElement' (JSVGElement) public const JSVGGradientElement = class external 'SVGGradientElement' (JSVGElement) public const JSVGFEBlendElement = class external 'SVGFEBlendElement' (JSVGElement) public const JSVGFEColorMatrixElement = class external 'SVGFEColorMatrixElement' (JSVGElement) public const JSVGComponentTransferFunctionElement = class external 'SVGComponentTransferFunctionElement' (JSVGElement) public const JSVGFECompositeElement = class external 'SVGFECompositeElement' (JSVGElement) public const JSVGFEConvolveMatrixElement = class external 'SVGFEConvolveMatrixElement' (JSVGElement) public const JSVGFEDisplacementMapElement = class external 'SVGFEDisplacementMapElement' (JSVGElement) public const JSVGFEMorphologyElement = class external 'SVGFEMorphologyElement' (JSVGElement) public const JSVGFETurbulenceElement = class external 'SVGFETurbulenceElement' (JSVGElement) public const ------------------------------------ $SMS_INSTALL_DIR\RTL\APIs\W3C\W3C.HTML5.pas JHTMLMediaElement = partial class external 'HTMLMediaElement' (JHTMLElement) public const JMediaError = class external 'MediaError' public const JApplicationCache = class external 'ApplicationCache' (JEventTarget) public const JHTMLTrackElement = class external 'HTMLTrackElement' (JHTMLElement) public const ------------------------------------ $SMS_INSTALL_DIR\RTL\APIs\W3C\W3C.File.pas JFileReader = class external 'FileReader' (JEventTarget) public const ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Application.pas type TModalInfo = class public ------------------------------------ $SMS_INSTALL_DIR\RTL\APIs\W3C\W3C.Canvas2DContext.pas JDrawingStyle = class external 'DrawingStyle' public ------------------------------------ There are still another classes living in the $RTTI, mainly TW3CustomControl and TW3MovableControl with scope "published" . We CAN NOT simply to hide the explicity published scope to that TW3* classes. The "published scope" used in the TW3* Classes is necessary in the Smart Mobile IDE, the Object Inspector expects this. So We can not simply comment //published as following: ------------------------------------ $SMS_INSTALL_DIR\rtl\System\System.Time.pas TW3Timer = class(TW3Component) //published property Delay: integer read FDelay write SetDelay; property Enabled: boolean read GetEnabled write SetEnabled; property OnTime: TNotifyEvent; ------------------------------------ $SMS_INSTALL_DIR\rtl\SmartCL\SmartCL.Components.pas TW3CustomControl = partial class(TW3MovableControl) //published property Font: TW3ControlFont read ( TW3ControlFont(GetFont) ); property OnTouchBegin: TTouchBeginEvent read FOnTouchBegins write _setTouchBegins; property OnTouchMove: TTouchMoveEvent read FOnTouchMoves write _setTouchMoves; property OnTouchEnd: TTouchEndEvent read FOnTouchEnds write _setTouchEnds; property OnGestureStart: TGestureStartEvent read FOnGestureStart write _setGestureStart; property OnGestureChange: TGestureChangeEvent read FOnGestureChange write _setGestureChange; property OnGestureEnd: TGestureEndEvent read FOnGestureEnd write _setGestureEnd; property OnMouseDown: TMouseDownEvent read FOnMouseDown write _setMouseDown; property OnMouseUp: TMouseUpEvent read FOnMouseUp write _setMouseUp; property OnMouseMove: TMouseMoveEvent read FOnMouseMove write _setMouseMove; property OnMouseEnter: TMouseEnterEvent read FOnMouseEnter write _setMouseEnter; property OnMouseExit: TMouseExitEvent read FOnMouseExit write _setMouseExit; property OnMouseWheel: TMouseWheelEvent read FOnMouseWheel write _setMouseWheel; property OnBeginMovement: TNotifyEvent read FOnBeginMovement write _SetBeginMovement; property OnEndMovement: TNotifyEvent read FOnEndMovement write _SetEndMovement; property OnHorizontalMovement: TMovementEvent read FOnHorizontalMovement write _SetHorizontalMovement; property OnVerticalMovement: TMovementEvent read FOnVerticalMovement write _SetVerticalMovement; property OnAllMovement: TMovementEvent read FOnAllMovement write _SetAllMovement; property OnClick: TMouseClickEvent read FOnClick write _setMouseClick; property OnDblClick: TMouseDblClickEvent read FOnDblClick write _setMouseDblClick; property OnContextPopup : TContextPopupEvent read FOnContextPopup write _setContextPopup; property OnKeyDown: TKeyDownEvent read FOnKeyDown write _setKeyDown; property OnKeyUp: TKeyUpEvent read FOnKeyUp write _setKeyUp; property OnKeyPress: TKeyPressEvent read FOnKeyPress write _setKeyPress; property OnAnimationBegins: TAnimationBeginsEvent read FOnAnimationBegins write _setAnimationBegins; property OnAnimationEnds: TAnimationEndsEvent read FOnAnimationEnds write _setAnimationEnds; property OnChanged: TChangedEvent read FOnChanged write _setChanged; property OnGotFocus: TGotFocusEvent read FOnGotFocus write _setGotFocus; property OnLostFocus: TLostFocusEvent read FOnLostFocus write _setLostFocus; property OnSelectionStarts: TSelectionStartsEvent read FOnSelectionStarts write _setSelectionStarts; property OnSelectionEnds: TSelectionEndsEvent read FOnSelectionEnds write _setSelectionEnds; property Enabled: boolean read GetEnabled write SetEnabled; property Angle: Float read FAngle write SetAngle; property Zoom: Float read GetZoom write SetZoom; property BorderRadius: integer read GetBorderRadius write SetBorderRadius; property StyleClass: string read GetStyleClass write SetStyleClass; property Visible: boolean read GetVisible write SetVisible; property Left: integer read GetLeft write SetLeft; property Top: integer read GetTop write SetTop; property Width: integer read GetWidth write SetWidth; property Height: integer read GetHeight write SetHeight; TW3ControlBackgroundSize = class(TW3OwnedObject) //published property Mode: TW3ControlBackgroundSizeMode read FMode write SetMode; property Width: integer read FWidth write SetWidth; property Height: integer read FHeight write SetHeight; TW3TagContainer = class(TW3TagObj) //published property Name: string read GetComponentName write SetComponentName; TW3TagObj = class(TW3Component {$IFDEF USE_ACTIONS} , IW3ActionSubscriber {$ENDIF} , IW3ComponentState ) //published (* Expose mouse-cursor, this can now be set in the property inspector. Note: This only affects devices capable of mouse handling, it has no effect what so ever on mobile devices that relies on touch *) property Cursor: TCursor read ( TW3MouseCursor.GetCursorFromElement(FHandle) ) write ( TW3MouseCursor.SetCursorForElement(FHandle, Value) ); ------------------------------------ $SMS_INSTALL_DIR\RTL\System\System.Time.pas TW3Dispatch = partial class public ------------------------------------ $SMS_INSTALL_DIR\RTL\System\System.Widget.pas TW3CustomComponent = partial class(TW3OwnedErrorObject) //published property Name: string; property TagValue: integer; property TagObject: TObject; ------------------------------------ $SMS_INSTALL_DIR\RTL\System\System.Application.Version.pas TW3ApplicationInfo = class(TW3OwnedObject) //published property Title: string; property Author: string; property Company: string; property Copyright: string; property VersionInfo: TW3ApplicationVersionInfo read FInfo; TW3ApplicationVersionInfo = class(TW3OwnedObject) //published property Major: integer; property Minor: integer; property Revision: integer; property Build: Integer; property Debug: boolean; property Special: boolean; property Comments: string; ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Assets.pas TW3CustomAsset = class(TW3OwnedObject, IW3AssetAccess) // published Property OnBeforeIO: TW3AssetBeforeIOEvent; property OnExecuting: TW3AssetIOEvent; property OnAssetReady: TW3AssetReadyEvent; property OnAssetFailed: TW3AssetIOFailureEvent; TW3AssetManager = class(TObject, IW3AssetManagerAccess) // published property OnFinished: TNotifyEvent; property OnAssetReady: TW3AssetLoadedManagerEvent; ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Effects.pas TW3CustomAnimation = class(TObject) //published property OnAnimationBegins: TFxAnimationBeginsEvent; property OnAnimationEnds: TFxAnimationEndsEvent; ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Events.pas TW3TouchEvent = class(TW3StandardDOMEvent) protected procedure DoHandleEvent(const EventObj: variant); override; // published property OnEvent: TW3DOMTouchEventObjTriggeredEvent; end; TW3DOMEvent = class(TW3SystemEventHandler) //published property OnEvent: TW3DOMEventObjTriggeredEvent; ------------------------------------ $SMS_INSTALL_DIR\RTL\System\System.Events.pas TW3SystemEventHandler = partial class(TW3OwnedObject) //published property OnEvent: TW3EventObjTriggeredEvent; ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Forms.pas TW3CustomForm = class(TW3CustomControl) //published property Caption: String read GetCaption write SetCaption; ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Dialogs.pas TW3AlertDialog = class(TW3CustomControl, IW3AlertDialog) //published property OnSelect: TW3AlertSelectEvent read FOnSelect write FOnSelect; ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\Controls\SmartCL.Controls.Label.pas TW3Label = class(TW3CustomControl) //published property AutoSize: boolean read FAuto write SetAuto; property Ellipsis: boolean read FEllipsis write SetEllipsis; property AlignText: TTextAlign read FHAlign write SetHAlign; property VAlign: TTextVAlign read FVAlign write SetVAlign; property WordWrap: boolean read GetWordWrap write SetWordWrap; property Caption: string read GetCaption write SetCaption; ------------------------------------ $SMS_INSTALL_DIR\RTL\SmartCL\Controls\SmartCL.Controls.Button.pas TW3Button = class(TW3CustomControl) //published property Caption : string read GetCaption write SetCaption; ------------------------------------ $SMS_INSTALL_DIR\RTL\System\System.Fonts.pas TW3CustomFont = partial class(TObject) //published property OnChanged: TNotifyEvent; ------------------------------------ Around the SmartCL* framework, we have a lot of ( classes TW3* ) with published methods and properties that will pollute our $RTTI variable, the idea was having a tiny $RTTI. So basically we have to DEFINE A DIRECTIVE {.$DEFINE RTTI} and use it in the runtime. Instead of comment //published scope in the TW3* classes prefer to use directive in runtime, just inform the directive RTTI, before you compile the project. Go to --> Project Options -> Compiler -> Custom Conditional Defines: RTTI; type TW3MovableControl = partial class(TW3TagContainer) ... property EdgeRadius: TW3BorderRadius read GetEdgeRadius; //published {$IFDEF RTTI} public {$ELSE} published {$ENDIF} ... property OnResize: TResizeEvent read FOnResize write _SetOnResized; .......... we have to insert this conditional directives, in the following classes, at least: $SMS_INSTALL_DIR\rtl\System\System.Time.pas TW3Timer = class(TW3Component) $SMS_INSTALL_DIR\rtl\SmartCL\SmartCL.Components.pas TW3CustomControl = partial class(TW3MovableControl) TW3ControlBackgroundSize = class(TW3OwnedObject) TW3TagContainer = class(TW3TagObj) TW3TagObj = class(TW3Component {$IFDEF USE_ACTIONS}, IW3ActionSubscriber{$ENDIF}, IW3ComponentState) $SMS_INSTALL_DIR\RTL\System\System.Time.pas TW3Dispatch = partial class $SMS_INSTALL_DIR\RTL\System\System.Widget.pas TW3CustomComponent = partial class(TW3OwnedErrorObject) $SMS_INSTALL_DIR\RTL\System\System.Application.Version.pas TW3ApplicationInfo = class(TW3OwnedObject) TW3ApplicationVersionInfo = class(TW3OwnedObject) $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Assets.pas TW3CustomAsset = class(TW3OwnedObject, IW3AssetAccess) TW3AssetManager = class(TObject, IW3AssetManagerAccess) $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Effects.pas TW3CustomAnimation = class(TObject) $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Events.pas TW3TouchEvent = class(TW3StandardDOMEvent) TW3DOMEvent = class(TW3SystemEventHandler) $SMS_INSTALL_DIR\RTL\System\System.Events.pas TW3SystemEventHandler = partial class(TW3OwnedObject) $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Forms.pas TW3CustomForm = class(TW3CustomControl) $SMS_INSTALL_DIR\RTL\SmartCL\SmartCL.Dialogs.pas TW3AlertDialog = class(TW3CustomControl, IW3AlertDialog) $SMS_INSTALL_DIR\RTL\SmartCL\Controls\SmartCL.Controls.Label.pas TW3Label = class(TW3CustomControl) $SMS_INSTALL_DIR\RTL\SmartCL\Controls\SmartCL.Controls.Button.pas TW3Button = class(TW3CustomControl) $SMS_INSTALL_DIR\RTL\System\System.Fonts.pas TW3CustomFont = partial class(TObject) now we have a thin $RTTI with metadata only for some classes: var $RTTI = [ { T: {ID:TExample}, A: { ClassType: RTTIPropertyAttribute, N: "Value", T: {ID:Number}, C: 3, G: function (s) { return s.FValue }, S: function (s,v) { s.FValue=v } } } ,{ T: {ID:TExample}, A: { ClassType: RTTIPropertyAttribute, N: "SeeMe", T: {ID:String}, C: 3, G: function (s) { return s.SeeMe }, S: function (s,v) { s.SeeMe=v } } } ,{ T: {ID:TExample}, A: { ClassType: RTTIMethodAttribute, N: "GiveMe", T: {ID:String}, I: 1, F: TExample.GiveMe } } ,{ T: {ID:TExample}, A: { ClassType: RTTIMethodAttribute, N: "Create", I: 1, F: TExample.Create$4 } } ,{ T: {ID:TExample}, A: { ClassType: RTTIPropertyAttribute, N: "Another", T: {ID:String}, C: 1, G: function (s) { return s.Field } } } ,{ T: {ID:TBase}, A: { ClassType: RTTIMethodAttribute, N: "Foo", I: 1, F: TBase.Foo } } ,{ T: {ID:TBase}, A: { ClassType: RTTIPropertyAttribute, N: "Stuff", T: {ID:String}, C: 3, G: function (s) { return s.Field }, S: function (s,v) { s.Field=v } } } ]; RTTI Example
  15. Onclick failure when switching TW3Editbox on iOS.

    If I could get some test source, I'd be happy to test. Especially as I'm working on this at the moment.
  16. Working with css, how to

    Someone posted a technique for injecting CSS, and while I normally dont go around correcting - the code posted was so bad that it could easily break the application. Smart has classes for css that are easy to use. Always check the RTL folder, and search in the class-browser. So if you are looking for CSS stuff, then search "CSS" in the class browser. Quick intro A stylesheet is just an object, like everything else in the DOM (document object model). The browser will take your css-files (if listed in the html) and load them in, then they turn up as objects you can access. But, you can also create these objects yourself and feed in the CSS as a string. You can even create single rules (or styles) as objects and manually populate them. Few does this since its easier to use a string. Loading CSS The easiest way to load an extra CSS file is to use the LoadCSS() method in TW3Storage. This is a class function in a static class, so you dont create an instance of TW3Storage first. You will find this class in SmartCL.FileUtils. An example for loading css looks like this: TW3Storage.LoadCss('thisurl', procedure (const FromUrl: string; const ObjectHandle: THandle; const Success: boolean) begin if success then begin writeln("css loaded"); end; end); Notice the parameter "objecthandle" in the anonymous callback. This is a handle to the created stylesheet object. You dont need to care about that, but if you should want to manually access the stylesheet DOM object after loading - then this is the easiest way to do it. The second method is to create a stylesheet class: var sheet := TW3StyleSheet.Create; sheet.append(#" .mystyle { background-color: #FFFFFF; }"); This class has several add methods, but it also has a very clear "Append" method, allowing you to add chunks of css style code. So as you can see, getting external css into its own stylesheet is very simple, and class based - rather than hacking into a stylesheet you simply presume will be there. The global stylesheet When your application starts a global stylesheet is created. This is not the theme stylesheet, but a secondary stylesheet that controls and units can use to stuff their dependencies into. All our effect css is stored in this secondary stylesheet. If you just need to store a couple of new styles or define some animation, then its overkill to create a third stylesheet object. Just append your code to the global stylesheet instead var globalstyles := TW3StyleSheet.GlobalStyleSheet(); globalstyles.append(#" .TMyCoolStuff { some-value: 12px; }"); The whole point of Smart is to create standard ways of accessing otherwise cumbersome things. Adding & removing styles from your controls TW3Stylesheet contains more class members that should be interesting: AddClassToElement RemoveClassFromElement FindClassInElement So whenever you want to add a style to a class, these are the best to use. You can also remove and check if a style is applied to an element with these. They take the control-handle as a parameter and should be fairly straight forward to understand. Well, hope it clears up a few things!
  17. Sleep?

    TW3Dispatch.Execute( procedure () begin // your code here end, 1000);
  18. Running two IDEs

    Sounds like feasible workaround I will give that a go.
  19. Sleep?

    @CzarI copy-pasted your example and it did work for me. But to be really sure, you should probably do it like this: FTimer := TW3EventRepeater.Create(function(Sender: TW3CustomRepeater):TW3RepeatResult begin writeln('Yup 1 second later'); result:=rrContinue; end,1000);
  20. Running two IDEs

    Are you trying to do that in one installation? Just make a copy of the SMS folder and make the IDE setting there. After that you can easily run two IDEs at the same time with no interference and you know for sure, which port belongs to which version. You can even have different versions of SMS there. So when a new update comes, you can test in the other folder and compare.
  21. Sleep?

    Just updating this thread as the code above no longer works FTimer := TW3EventRepeater.Create(function(Sender: TW3CustomRepeater):TW3RepeatResult begin showmessage('Yup 1 second later'); end,1000); }
  22. Yesterday
  23. Running two IDEs

    That works but it is quite clunky. Would it be possible for second IDE to shut the browser down if it finds a copy running?
  24. SmartCL.theme,

    my bad, i updated an earlier project. please ignore suggestion
  25. SmartCL.theme,

    What is a standard project? Do you mean a "Visual Components Project"? If so, it is already added by default when creating the project.
  26. SmartCL.theme,

    Might be a good idea to add SmartCL.theme, to standard project otherwise you end up with syntax errors
  27. Onclick failure when switching TW3Editbox on iOS.

    Bug still present in 2.9.9.67
  28. Alpha 2.9.9.59 InsertRule CSS Error

    Still broken in 2.9.9.67
  1. Load more activity
×