Jump to content

All Activity

This stream auto-updates     

  1. Yesterday
  2. DavidRM

    How to add a CSS file to a project?

    Add, Resource File(s), change it to "All FIles". Then you can select a CSS file.
  3. Last week
  4. IElite

    Graphics in Grid

    Maybe @jarto or @lennart could add your { TW3ImageColumn } to the RTL for the next release - and update the featured Demos and the missing documentation
  5. bwheatley

    How to add a CSS file to a project?

    I'm a new user and I see where you can add forms, units, JavaScript files, and JSON files. However I don't see anywhere to add a CSS file to the visual project in the IDE.
  6. lynkfs

    Graphics in Grid

    sorry, been a long day, did something wrong by mistake still all posts are here
  7. COMFIED

    Graphics in Grid

    Is it possible to add pictures on a smartmobilestudio grid component, so that each row has a different picture picked from a database, much like Delphi Fishfact demo?
  8. jarto

    Prerequisites?

    Will do that. Thank you for pointing it out.
  9. lynkfs

    state machine

    A finite state machine. The FSM implemented below is taken from this article, which explains link between event based UX and FSM. Worthwhile reading. Every state is an object and has one or more actions associated. The implementation here uses messaging, which makes it much simpler. type idle = class procedure click(caption:string); Button: TW3Button; end; type fetch = class procedure fetchResult; procedure Success; procedure Error; end; type error = class procedure retry; end; type TForm1 = class(TW3Form) private {$I 'Form1:intf'} protected procedure InitializeForm; override; procedure InitializeObject; override; procedure Resize; override; end; var State : variant; var window external 'window': variant; implementation procedure idle.click(caption:string); begin writeln('click'); Button := TW3Button.Create(Application.Forms[0]); Button.SetBounds(50,50,200,40); Button.Caption := caption; Button.OnClick := procedure(sender:TObject) begin State := 'fetch'; //initiate the fetch, say xmlhttprequest window.postMessage([State],'*'); Button.Destroy; end; end; procedure Fetch.fetchResult; begin //get fetch return code var resultCode : boolean := false; // or true. if resultCode then Success else Error; end; procedure Fetch.Success; begin writeln('success'); State := ''; window.postMessage([State],'*'); end; procedure Fetch.Error; begin writeln('error'); State := 'error'; window.postMessage([State],'*'); end; procedure error.retry; begin writeln('retry'); State := 'idle'; window.postMessage([State,'Error : Retry'],'*'); end; { TForm1 } procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components var idleState := idle.Create; var fetchState := fetch.Create; var errorState := error.Create; State := 'idle'; window.onmessage := procedure(evt:variant) begin if evt.data[0] = 'idle' then idleState.Click(evt.data[1]); if evt.data[0] = 'fetch' then fetchState.fetchResult; if evt.data[0] = 'error' then errorState.Retry; end; window.postMessage([State,'Fetch'],'*'); end;
  10. JimKueneman

    Prerequisites?

    Then you should take XP off the website as a prerequisite if you not going to support it anymore.
  11. lynkfs

    Radio Button Styles ?

    see if this helps you out unit Form1; interface uses System.Types, System.Types.Convert, System.Objects, System.Time, SmartCL.System, SmartCL.Time, SmartCL.Graphics, SmartCL.Components, SmartCL.FileUtils, SmartCL.Forms, SmartCL.Fonts, SmartCL.Theme, SmartCL.Borders, SmartCL.Application, SmartCL.Controls.RadioGroup, SmartCL.Controls.RadioButton, System.Colors; type TForm1 = class(TW3Form) private {$I 'Form1:intf'} protected procedure InitializeForm; override; procedure InitializeObject; override; procedure Resize; override; RadioGroup1 : TW3RadioGroup; Button1 : TW3RadioButton; Button2 : TW3RadioButton; end; implementation { TForm1 } procedure TForm1.InitializeForm; begin inherited; // this is a good place to initialize components RadioGroup1 := Tw3RadioGroup.Create(self); RadioGroup1.SetBounds(50,50,300,100); Button1 := RadioGroup1.Add('Button1'); Button2 := RadioGroup1.Add('Button2'); Button1.CheckRadio.handle.style['-webkit-appearance'] := 'none'; Button1.CheckRadio.handle.style['-moz-appearance'] := 'none'; Button1.CheckRadio.handle.style['border'] := '1px solid grey'; Button1.CheckRadio.handle.style['border-radius'] := '50%'; Button1.CheckRadio.handle.style['background'] := 'silver'; // Button1.CheckRadio.onclick := procedure(sender:TObject) // begin // Button1.CheckRadio.handle.style['background'] := 'red'; // Button1.Label.handle.style['color'] := 'blue'; // end; Button1.onchecked := procedure(sender:TObject) begin Button1.CheckRadio.handle.style['background'] := 'blue'; Button1.Label.handle.style['color'] := 'green'; end; Button2.CheckRadio.handle.style['-webkit-appearance'] := 'none'; Button2.CheckRadio.handle.style['-moz-appearance'] := 'none'; Button2.CheckRadio.handle.style['border'] := '1px solid grey'; Button2.CheckRadio.handle.style['border-radius'] := '50%'; Button2.CheckRadio.handle.style['background'] := 'silver'; Button2.onchecked := procedure(sender:TObject) begin Button2.CheckRadio.handle.style['background'] := 'blue'; Button2.Label.handle.style['color'] := 'green'; end; //hoover Button1.handle.onmouseover := lambda(e: variant) Button1.CheckRadio.handle.style['background'] := 'red'; end; Button1.handle.onmouseout := lambda(e: variant) Button1.CheckRadio.handle.style['background'] := 'silver'; end; Button2.handle.onmouseover := lambda(e: variant) Button2.CheckRadio.handle.style['background'] := 'red'; end; Button2.handle.onmouseout := lambda(e: variant) Button2.CheckRadio.handle.style['background'] := 'silver'; end; end; The rtl's radiobutton / toggle is derived from an <input> html element with type = radio. Which means the browser takes control of styling of these elements. Period. The trick in the mozilla article is to simply remove all browser styling by setting '-webkit-appearance' to 'none'. That at least gives you on the opportunity to add your own styling. The example above is not the end-all of all possibilities, but at least it does something on 'hoover', ('click') and 'check'. If you're set on having a select-dot in selected radio-buttons, that will be possible too by setting a background-image on the toggle (as in prev post) Button1.CheckRadio.handle.style['background-size'] := 'cover'; Button1.CheckRadio.handle.style['background-image'] := CheckImage;
  12. jarto

    TW3Chart and TFloatArray issue

    Ah, now I understand. I believe we need to remove that comment. Thank you for noticing this!
  13. Christian

    TW3Chart and TFloatArray issue

    I mean this: procedure TSeriesData.Refresh; begin asm (@Self.FHandle).values=((@FValues)); end; asm (@Self.FHandle).labels=((@FLabels)); end; asm (@Self.FHandle).colors=((@FColors)); end; //asm (@Self.FHandle).x=((@FX)); end; end; So Serie.Data.X.Add does not update the chart component, because Refresh ignores the X values. If you know it, it is not a big deal to work around this issue. I just wonder why this has been disabled. Christian
  14. jarto

    Prerequisites?

    I'm afraid, there's very, very little we can do for this. XP is not a supported Microsoft OS any more.
  15. jarto

    TW3Chart and TFloatArray issue

    What do you mean with " why X is not updated and excluded in TSeriesData.Refresh? "
  16. IElite

    Radio Button Styles ?

    @lynkfs thanks, I have played with your series of components in the past. Great Job. However, I am not sure it solves my issue of being able to style the Toggle - and specifically the events such as checked, unchecked, enabled, disabled, hover
  17. Christian

    TW3Chart and TFloatArray issue

    Hi, today i thought i try to get in touch with the Tw3Chart. To do so i made a small example: const // Stefan-Boltzmann constant, and has the value 5.67 x 10-8(Wm-2K -4) cBoltzman = 0.0000000567; // 30% of the short wave radiation that hits the earth is bounced back into space. cAlbedo = 0.3; // A solar constant is the amount of radiation given off by the sun. // Over a long period of time this may change, but for this model we can // assume that it will stay at 1370. S is expressed in W / m2 or Watt per square meter cSolarConstant = 1370; procedure TForm1.InitializeForm; var carbon, atmosphere: single; Serie: TSeries; begin inherited; // this is a good place to initialize components W3Chart1.Title.Text := 'Simple Climate Model'; W3Chart1.Axes.Left.Title.Text := 'Temperature in °C'; W3Chart1.Axes.Bottom.Title.Text := 'Atmospherical absorbation'; Serie := TLineSeries.Create; W3Chart1.AddSeries(Serie); carbon := 0; while carbon < 1 do begin atmosphere := Power(((1 - cAlbedo) * cSolarConstant) / (4 * cBoltzman * (1 - carbon / 2)), 0.25) - 273; Serie.Data.Values.Add(atmosphere); Serie.Data.X.Add(Carbon); carbon := carbon + 0.1; end; Serie.RefreshData; end; The formula is based on this lecture: https://www.e-education.psu.edu/meteo469/node/198 Is there a reason why X is not updated and excluded in TSeriesData.Refresh? This work around does run okay, but has another annoying issue. It seem to be that you can not use 0.1 steps for the x axis. procedure TForm1.InitializeForm; var carbon, atmosphere: single; Serie: TSeries; X, Y: TFloatArray; begin inherited; // this is a good place to initialize components W3Chart1.Title.Text := 'Simple Climate Model'; W3Chart1.Axes.Left.Title.Text := 'Temperature in °C'; W3Chart1.Axes.Bottom.Title.Text := 'Atmospherical absorbation'; W3Chart1.Legend.Visible := false; Serie := TLineSeries.Create; W3Chart1.AddSeries(Serie); carbon := 0; while carbon < 1 do begin atmosphere := Power(((1 - cAlbedo) * cSolarConstant) / (4 * cBoltzman * (1 - carbon / 2)), 0.25) - 273; Y.Add(atmosphere); X.Add(Carbon*10);//somehow 0..1 does not work? carbon := carbon + 0.1; end; Serie.Data.X := X; Serie.Data.Values := Y; end; Christian
  18. JimKueneman

    Prerequisites?

    Version 3.0 looks exciting but still it begins to start then crashes out in XP. Same argument that a MacAir can't really handle later than XP in a VM with the 2 core processor....
  19. Earlier
  20. lynkfs

    Radio Button Styles ?

    Some html elements are notoriously difficult to style, and browsers have all kind of different ways of doing it anyway. A good article : https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms/Advanced_styling_for_HTML_forms In the native framework I opted for completely bypassing the browsers antics and make my own. In the end a radio button group can be as simple as a panel with a number of radio buttons (which can be panels as well with rounded corners) and associated labels. Not suggesting you should follow that road, but if it helps here is the component code I used there unit JRadioButton; interface uses JElement, JPanel; type JW3RadioButton = class(TElement) public constructor Create(parent: TElement); virtual; Checked: Boolean := false; Label: String; RadioButtonDimension: integer := 16; Button : TElement; end; var CheckImage: String; implementation uses Globals; { JW3RadioButton } constructor JW3RadioButton.Create(parent: TElement); begin inherited Create('div', parent); //background panel (div) for RadioButton & label (borderless) //create RadioButton self.Button := TElement.Create('div', self); //button not based on 'button' element but on panel (div) //with rounded corners self.Button.SetProperty('border','1px solid #0066cc'); self.Button.SetProperty('border-radius','50%'); self.Button.setProperty('background-size', 'cover'); self.Button.SetProperty('cursor','pointer'); self.Button.Width := RadioButtonDimension; self.Button.Height := RadioButtonDimension; self.Button.OnClick := procedure(sender: TObject) begin //set all radiobuttons to un-selected var d := self.handle.parentNode.children; for var i := 0 to d.length -1 do begin var e := d[i].children; for var j := 0 to e.length -1 do begin e[j].style.backgroundImage := 'none'; end; end; //set clicked one to selected self.Button.SetProperty('background-image',CheckImage); window.postMessage([self.Button.handle.id,'click',checked],'*'); end; self.OnClick := self.Button.OnClick; //self.Observe; self.OnReadyExecute := procedure(sender: TObject) begin If Checked then self.Button.SetProperty('background-image',CheckImage); var Label1 := JW3Panel.Create(self); Label1.SetinnerHTML(Label); Label1.OnClick := Button.OnClick; Label1.SetProperty('cursor','pointer'); Label1.SetProperty('font-size', '0.85em'); Label1.Handle.style.width:='auto'; Label1.Handle.style.height:='auto'; self.Button.SetBounds(0,0,RadioButtonDimension,RadioButtonDimension); Label1.SetBounds(trunc(RadioButtonDimension*1.5), self.Button.top+RadioButtonDimension-Label1.handle.clientHeight+2, Label1.handle.clientWidth+2, RadioButtonDimension-RadioButtonDimension+Label1.handle.clientHeight); end; end; initialization CheckImage := 'url(data:image/jpeg;base64,'+ '/9j/4AAQSkZJRgABAgAAZABkAAD/7AARRHVja3kAAQAEAAAAHgAA/+4ADkFkb2JlAGTAAAAAAf/bAIQ' + 'AEAsLCwwLEAwMEBcPDQ8XGxQQEBQbHxcXFxcXHx4XGhoaGhceHiMlJyUjHi8vMzMvL0BAQEBAQEBAQE' + 'BAQEBAQAERDw8RExEVEhIVFBEUERQaFBYWFBomGhocGhomMCMeHh4eIzArLicnJy4rNTUwMDU1QEA/Q' + 'EBAQEBAQEBAQEBA/8AAEQgAOQA5AwEiAAIRAQMRAf/EAI8AAAICAwEAAAAAAAAAAAAAAAUGAAQBAgcD' + 'AQEBAQEBAAAAAAAAAAAAAAAFAwQBAhAAAQMDAAUHCgcAAAAAAAAAAQACAxEEBSExQRITUWGBkSJCBnG' + 'hscHRMlJyIzPhYpKyUxQWEQACAQMCAwcFAQAAAAAAAAABAhEAEgMTBCFBUWGBocEiQhQxcZEycpL/2g' + 'AMAwEAAhEDEQA/AOgKnf5O1sGVldV592Nulx9imUyDLC2Mp0yO7MTeV3sCTZppZ5HSyuL5HGrnFattt' + 'tT1NwQeNZdzudP0rxc+FE7nxHfykiHdgZsoN53W72KmcpkSam5k/UR6FVWKhIrhxqICL+KObNkYyXb8' + '0RhzuTiNeNxB8LwHfijWP8Q29yRFcAQSnQDXsOPl2dKVVF4ybbE4/UKeq8K949zlQ/sWHRuNdAWUA8P' + '5VzyLG4dV1PovOug7h9SPo74z6ul3zyt60j8lNLV7o53dKUvENy6bIGLuQANHlPacULVjIEm+uCdfFf' + '8AuKrpXEoXGijkoorKxbI7HmxoxhcK27b/AGbmvArRjBo36ayTyJjjs7WJgZHCxrRs3QvPGtY3H24j9' + '3htPWKnzq0is+Z3dpJgGAKVwYURFgCSJJoRkcBbXDHSWzRDONIA0NceQjYlUgtJaRQg0I5wugpLzLWt' + 'ydwG6t4HpIBK1bLMzEoxugSJrLvcKqA6i2TBiqkcj4pGyxmj2EOaecJj/wBNb/xuS0taBbbRcG5gR3G' + 'sVxtK8iZ7xRPPW7oMlIaUbLSRvTr86HJvzWNN9bAx/fiqWfmB1t6UoEFpIcKEaCDoIIUNrlD4wPcgtP' + 'lV91iKZCfa5uHnTDgMtCyIWVy4MLT9J50NIPdJR/XpC5+t2zztG62R7W8gcQFPNsg7Fla2eJETVMO9K' + 'KFZbo4AzFOOQydvYxEvcHTU7EQ1k8/IEmySPlkdLIaveS5x5ytSSTUmpOslRWwbdcQMG4n6mo59w2Ui' + 'RaB9BUAJIDRUnQANpRr/ADE/xt6lPD2NdLML2UUijP069542+QelM65rrrjFPtP+uld0G0Dlj3D/AD1' + 'qIXk8HBekyxnhXB1u7rvmHrRRRGYdS8aU3dnnSebTsOrFvb5Uk3OKv7YniQuLR32Deb1hVCCDQihXQV' + 'TuPvMSqnNHqGM/ZiPKimGGfScg+6g+dJ8NrczmkMT3k8gNOtGsf4bcSJL40GyFp1/M4epMLdSypZ/k2' + 'mwKP5Mt4xVcHxrheWP9CF8JrVrWsaGMAa1ooANAAC2UURfGe2lOEdlf/9k=)'; end.
  21. IElite

    Radio Button Styles ?

    There is no style for Radio Group (TW3RadioGroup.) Where does it get its style from? There is also no style for a Radio Button (TW3RadioButton) Where does it get its style from? A Radio Button is made up of a Label (TW3RadioButtonLabel) and a Toggle (TW3RadioToggle) Now, its easy to give any of these controls a style using the controls style.setProperty method handle.style.setProperty('background-color', '#c7b7a5'); Or, I can use the CUSTOM CSS sheet and add them there e.g. .TW3RadioButtonLabel{ background-color: red; margin-top: 2px; margin-bottom: 2px; } How do I style the Toggle? I tried: .TW3RadioToggle{ background-color: green; } I get no change. However, things are more complicated then that. e.g. the radio button may need to have differnt styles for different status of the control Checked versus unchecked mouse hover etc How to I create styles for these? e.g. .TW3RadioToggle:hover { background-color: yellow; } So, to make a long story short, I would like to style my Radiobuttons
  22. IElite

    Code does not work in external chrome browser

    Kool......glad you were able to find the issue. Not sure why I wasn't getting an error. I uploaded the program to a site online and it works without any code changes. So, I can live with the issue in External Chrome now that I know its gonna work when deployed Thanks for all your help!
  23. Igor Savkic

    Code does not work in external chrome browser

    > Sure, I have sent it to you via forumn messenger I get error: "Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https" From googling it seems Chrome denies all HttpRequests to file://urls. You have two options: a) Add some basic server that will serve these files b) Try to embed json data as image, there is SMS option for it binary data to image, it doesn't work for me (old version of SMS) but try yourself. I remember seeing somewhere post about it but I cannot find it now. I think correct path would be to use TW3Image to load such DataAsImage file, convert to TW3ImageData and from there extract string and parse it as you would usually.
  24. IElite

    Code does not work in external chrome browser

    Sure, I have sent it to you via forumn messenger
  25. Igor Savkic

    Code does not work in external chrome browser

    I don't know, key is how Chrome sees it. Make sure it's not using cached data for that file. BTW if you have some example I can test it on my computer.
  26. IElite

    Code does not work in external chrome browser

    "Perhaps res\data.json is empty or doesn't exist? " So it doesn't exist for Chrome? But it does for the other three browsers?
  27. Igor Savkic

    Code does not work in external chrome browser

    > So its empty only in the External Chrome browser, but NOT empty in Internal default Chrome Broswer (IDE) and NOT ecmpty in > External IE, Firefox, and Safari browsers? How could that be? > I load the JSON data...fHttp.Get('res\data.json'); Perhaps res\data.json is empty or doesn't exist? Try to use some manually assigned value to string instead of loading from file. > then onDataReady, I place data in string and then parse it ....as a test, Check first if OnDataReady is even called, I suspect something is wrong in that area of obtaining data. > I stringify the parsed data and display it in a show message > The showMessage does not display when running in external Chrome browser. Not showing at all or empty, try to use WriteLn instead, it should always work.
  28. IElite

    Code does not work in external chrome browser

    So its empty only in the External Chrome browser, but NOT empty in Internal default Chrome Broswer (IDE) and NOT ecmpty in External IE, Firefox, and Safari browsers? How could that be? I load the JSON data... procedure TStart.InitializeForm; begin inherited; fHttp.Get('res\data.json'); end; then onDataReady, I place data in string and then parse it .... as a test, I stringify the parsed data and display it in a show message procedure TStart.HandleHttpDataReady(Sender:TW3HttpRequest); begin fJSONStr:= Sender.ResponseText; gData:= JSON.parse(fJSONStr); ShowMessage(JSON.Stringify(gData)); end; The showMessage does not display when running in external Chrome browser. However, it does display in the IDE's internal Chrome browser as well as in IE, Firefox, and safari browsers
  1. Load more activity
×