Search the Community

Здравствуйте. Нам требуется в нашем приложении UniGui задействовать Draw-движок ExtJS (https://docs.sencha.com/extjs/7.5.1/guides/core_concepts/draw/drawing.html). В десктопной версией нашего приложения у нас всё получилось. Проблема возникла в мобильной версии приложения. Проблема возникла с использованием Layout родительского контейнера. Я сделали тестовый пример, с демонстрацией этой проблемы. В этом тестовом примере: 1) используется mfPage; 2) подключается внешний js-файл files/ExtJSDrawTest.js (приведён далее); 3) в этом js-файле объявляется (Ext.define) компонент ExtDrawTest, наследуемый от Ext.draw.Container. Этот компонент просто рисует чёрную рамку по своему периметру с небольшим отступом. Для рисования используется sprite rect; 4) в примере есть две главные формы, одна для десктопной версии (MainForm), вторая для мобильной (MainMForm); 5) на обе формы положена панель, которая растягивается нв всю форму: uniAlignmentClient, form.Layaout=fit; 6) для панели свойство Layout установили в fit, чтобы дочерний компонент тоже занял всё пространство панели; 7) в код форм добавили вот такой код: procedure ...UniFormCreate(Sender: TObject); begin Panel.JSInterface.JSCallGlobal('DrawTestInit',[]); Panel.JSInterface.JSCallGlobal( 'DrawTest.CreateDrawTest', [Panel.JSInterface.JSStatement(Panel.JSName)], FTestVarName ); end; 8 ) первым вызовом я объявляю наш тестовый компонент, а вторым добавляем его на панель. Всё делается в JS-коде. Связывание панели и тестового компонента выполняется в JS-коде через использование метода add; 9) в десктопной версии всё отлично работает, а вот в мобильной - нет. В мобильной не происходит растягивания нашего тестового компонента (наследника от Ext.draw.Container) на всю родительскую панель. Если прописать width и height то всё будет нормально, но нужно чтобы было именно автоматическе растягивание; 10) если в js-коде вместо нашего компонента создать панель (Ext.panel.Panel, см. закомментированный код далее), то тоже всё отлично работает в обоих версиях приложения. Подскажите, в чём может быть проблема? Вот вес JS-код (ExtJSDrawTest.js) : class DrawTest { static IsInited = false; static CreateDrawTest(cnt) { let test = null; test = Ext.create('ExtDrawTest', { renderTo: Ext.getBody() }); /* test = Ext.create('Ext.panel.Panel', { title: 'Панель 1', html: 'Привет мир!', style: 'margin: 10px', border: true }); */ cnt.add(test); return test; }; } function DrawTestInit() { if (DrawTest.IsInited) { return; } DrawTest.IsInited = true; Ext.define("ExtDrawTest", { extend: "Ext.draw.Container", plugins: { spriteevents: true }, sprit1: null, renderedHeight: 0, renderedWidth: 0, drawTest: function() { let suf = this.getSurface(), h = this.getHeight(), w = this.getWidth(), sp = null; suf.removeAll(true); sp = suf.add({ type: 'rect', x: 10, y: 10, lineWidth: 4, strokeStyle: 'black', width: w-20, height: h-20, zindex: 0 }); this.sprit1 = sp; }, renderTest: function() { this.drawTest(); }, renderFrame: function () { this.renderTest(); this.callParent(); } }); } Весь код проекта тоже прикладываю ExtJSDrawTest.zip

FARSHAD, please add this feature. I have all the code shown below. Works nice. I wanted a /d switch to force desktop mode, just like /m forces mobile mode. I searched and searched and only found one mediocre solution. It required that you change the ServerModule.UniServerModule.Options:=serverModule.UniServerModule.Options-[soAutoPlatformSwitch]; P:=the URL without the /m so that it loads the Desktop version UniSession.UrlRedirect(P); With this logic, it mostly worked, but would hang sometimes. Also, it changes the way the server operates. IE: If ANOTHER user logs in on another session, there would be NO AUTO DETECT FOR THE PLATFORM SWITCH So, i discarded it. Also, there are a number of sites that describe how to get the iPad Safari to force desktop mode. My OLD iPad didn't have the available setting to do that AND if it DID work, it would force ALL web sites to use the desktop version. Couldn't make it site specific, like you can in chrome. The solution needs to EASY and not mess up other web sites... and not hang... and not mess up with the auto platform switching. SOOOOOooo, i added a new switch. I added the "/d" switch. Much like the /m forces the mobile mode, the /d forces the desktop mode. THis magic is done in the uniGUIServer.pas file. And inside the GetUniGUISession function. Add this in vars. ForceDeskTop:Boolean; //DLR Then add the ForceDesktop:=False in between the FServerMonitor and SessionClass initializations. FServerMonitor := False; ForceDeskTop:= False; // DLR SessionClass := TUniGUISession; Then after the check for the 'server' switch, add the check for the /d switch... ADoc := uniHTTPDocument(ARequest.Document); FServerMonitor := SameText(ADoc, 'server') and FAllowWebMonitor; if FServerMonitor then begin ARequest.Document := '/'; ADoc := ''; end; { DLR - Check for the /D switch } ForceDeskTop:= SameText(ADoc, 'd'); if ForceDeskTop then begin ARequest.Document := '/'; ADoc := ''; end; The final piece of the puzzle is to bypass the auto switch. So, place the new code after setting the ForceMobile variable. ForceMobile := (not Assigned(MainFormClass[TUniPlatformDesktop])) or ( (soAutoPlatformSwitch in FOptions) and (currPlatform = upMobile) ); { DLR Should i get rid of ForceMobile? } If ForceDeskTop Then ForceMobile:=False; So, essentially, if i find the /d then i ignore the auto switch. This allows for 3 ways to load the application... 1. somesite.com/mdemo.dll works for most cases and devices. 2. somesite.com/mdemo.dll/m allows you to force it show the MOBILE forms 3. somesite.com/mdemo.dll/d allows you to force it show the DESKTOP forms I know this is not elegant, but gives the "force desktop" capability without messing around with the server options that can affect other sessions. And you don't have to mess around with browser settings. To me this was the best solution. FARSHAD: Could you please add this /d capability so that others can also make use of this? 95% of the time the auto works great. But for iPads and tablets that are large enuf, its nice to view the DESKTOP version even though the stupid browser on the device might indicate that it's a mobile device. Make sense? Thanks DAvie

Dear Pros, I would like to build a search edit that looks mostly like the search edit field of google. Concerning the lookup - function it should be possible to proceed just with entering text (the Lookup just should be a helper, the data behind can be very large). I think there was already such a thing discussed in the group here, but I couldnt find. Any inspirations welcome! Gery/Cyprus

I am using latest version. This may be a know issue, I used the CustomCSS to change the TITLE HEIGHT. You can see near the top, i have x.-toolbar .-title and changed the size to 36pt. But yet when i run inside chrome on my laptop with the /M it shows with the nice LARGER font. BUT when I run it inside chrome on my cellphone, it remains SMALL font. You can see this from my 2 screenshots. .x-checkboxfield .x-input-el { opacity: 10; } .x-toolbar .x-title { font-weight: bold; font-size: 36pt;} .customGlyph32 .x-icon-el { width: 32px !important; height: 32px !important; } .customGlyph24 .x-icon-el { width: 24px !important; height: 24px !important; } .CustomAlignMobile .x-inner-el { line-height: normal; padding-top: 0 !important; } .x-mask-msg div{ font-family: Ubuntu, Arial, sans-serif; font-size: 24px; } .MyTitle .x-panel-header-default-horizontal { height: 11px; padding: 0px 10px 0px 10px; } .x-grid-row-selected .x-grid-cell-inner { font-weight: bold; color: rgb(255,0,0); background-color:green; } .myStyle1 { background-color: rgb(0,255,255) !important; border-radius: 25px 25px 25px 25px; -moz-border-radius: 25px 25px 25px 25px; -webkit-border-radius: 25px 25px 25px 25px; color: rgb(0,0,255); border: 1px solid #1a26d4; } .DBG1 .x-grid-row-selected .x-grid-cell-inner { background-color:green!important; } .DBG2 .x-grid-item-selected .x-grid-cell { font-weight: bold!important; background-color:blue!important; } .x-grid-row-selected2 .x-grid-cell-inner { font-weight: bold!important; background-color:green!important; } .addGreenPanel .x-panel-body-default { background: rgb(0,128,0); } .addLightGreenPanel .x-panel-body-default { background: rgb(161, 239, 161); } .addRedPanel .x-panel-body-default { background: rgb(240,96,96); } .addLightRedPanel .x-panel-body-default { background: rgb(240,180,180); } .addYellowishDarkerBG .x-form-text{ background-color: rgb(208,208,128)!important; background-image: none; } .addYellowishDarkerBG_2{ background-color: rgb(208,208,128)!important; background-image: none; } .addYellowishBG .x-form-text { background-color: rgb(252,252,176)!important; background-image: none; } .addYellowishBG_2{ background-color: rgb(252,252,176)!important; background-image: none; } .addYellowBG .x-form-text{ background-color: yellow!important; background-image: none; } .addYellowBG_2{ background-color: yellow!important; background-image: none; } .addRedBG .x-form-text { background-color: rgb(255,200,200)!important; background-image: none; } .addRedBG_2{ background-color: rgb(255,200,200)!important; background-image: none; } .addFFFFFFBG{ background-color: rgb(255,255,255)!important; background-image: none; } .addE8E8E8BG{ background-color: rgb(232,232,232)!important; background-image: none; } .add000000Font{ color: rgb(0,0,0)!important; background-image: none; } .addBlackForceFont{ color: rgb(0,0,0)!important; background-image: none; } .addGrayForceFont{ color: rgb(0,0,0)!important; background-image: none; } .add606060Font{ color: rgb(96,96,96)!important; background-image: none; } .addBlackFont{ color: rgb(0,0,0)!important; background-image: none; } .MyStyleW .x-form-text{ color:red!important; height:8px; font-size: 24px; background-color:yellow!important; background-image:none; } .QQQQQQQMyStyleW{ color:red!important; height:8px; font-size: 24px; background-color:yellow!important; background-image:none; } I find it odd that the desktop chrome displayed the title nice and big, while the mobile chrome displayed the title tiny. Davie Screenshot_Chrome_Mobile.bmp Screenshot_Chrome_Desktop.bmp

I used your logic to hide the title bar. Self.WebForm.JSInterface.JSCall('owner.titlebar.hide', []); It works GREAT. It hides the title bar. HOWEVER, the extra screen space that I SHOULD get is NOT available See screen shot... It doesn't have the title bar (great) BUT at the bottom of the screen, there is about 1/2 inch of WHITE space between the red arrows. My panel is alClient so it should fill the whole area, but it doesn't Do I need another line of code or something? Thanks Davie

I need urgent help if you please. I am trying to take many photos using mobile Camera. The mobile App is webview and I am using UnimFileUpload. When I take a photo, it overwrites the previous one. I tried to rename, copy, move, unlock the photo but to no avail. The file is locked by IIS and is overwritten whenever I take another photo. Can anybody help me? I am attaching a video showing the problem. UniGUI people: I have contacted you since last March about this but did not get an answer from you until now. I am in a very serious situation and will lose my current project if I don't solve this issue. MobPhotos.mp4

how do I play mp3 audio in a mobile app? I tried using html5, put in a unimHtmlFrame1 content: <audio id = "player3" src = "files / music.mp3"> </ audio> and I called to play using the code: UniSession.SendResponse ('var ael = document.getElementById ("player3"); ael.load (); ael.play ()'); It works perfectly on the desktop, but not on mobile! also I tried using: unimUrlFrame1.URL: = 'http: //192.168.25.198: 8077 / m / files / music.mp3'; again it works perfectly on the desktop but not on mobile, but if I put in the android browser manually, it works! please help me if you can Leandro Ávila

Hi, I just made a HTTP call in UniGui Desktop and it works perfectly. I made the same in UniGui Mobile using mobile components and it's not working. HTTP - Request procedure TUFmLoginm.btLoginRequestClick(Sender: TObject); Var aUrlSubmit, aUrlCancel, aUrl, sProtocol :string; Begin frmPinm.UnimURLFrame1.URL := ''; if UniServerModule.PINEndPoint.Contains('https') then sProtocol := 'https' else sProtocol := 'http'; aUrlSubmit := UniSession.CallbackUrlEx('loggedwithcredentials', self, ['RES', 'OK']); if sProtocol.Contains('https') and not aUrlSubmit.Contains('https') then aUrlSubmit := aUrlSubmit.Replace('http', sProtocol, []); aUrlSubmit := aUrlSubmit.Replace(#$D#$A, '', [rfReplaceAll]); aUrlSubmit := TNetEncoding.URL.Encode(TStringRoutines.GetBase64CryptedString(aUrlSubmit)); aUrlCancel := UniSession.CallbackUrlEx('logincancelled', self, ['RES', 'Cancel']); if sProtocol.Contains('https') and not aUrlCancel.Contains('https') then aUrlCancel := aUrlCancel.Replace('http', sProtocol, []); aUrlCancel := aUrlCancel.Replace(#$D#$A, '', [rfReplaceAll]); aUrlCancel := TNetEncoding.URL.Encode(TStringRoutines.GetBase64CryptedString(aUrlCancel)); if TUniGUIApplication(UniApplication).Parameters.values['gestore'].IsEmpty then aUrl := UniServerModule.PINEndPoint+'/?action=authn&gestore='+UniMainModule.gestore+'&url_submit='+aUrlSubmit+'&url_cancel='+aUrlCancel+'&_S_ID='+UniSession.SessionId+'&appid='+UniMainModule.appID else aUrl := UniServerModule.PINEndPoint+'/?action=authn&gestore='+TUniGUIApplication(UniApplication).Parameters.values['gestore']+'&url_submit='+aUrlSubmit+'&url_cancel='+aUrlCancel+'&_S_ID='+UniSession.SessionId+'&appid='+UniMainModule.appID; frmPinm.UnimURLFrame1.URL := aURL; frmPinm.Show End; End Point procedure TFrmAuthnm.FormPost; var data_event : string; begin { ... elaboration ... } with UniMainModule.GetDM do begin if not UniMainModule.Url_submit.IsEmpty then begin if FResponsePost then begin s := 'var f = document.createElement("form"); '+ 'f.action="'+UniMainModule.Url_submit+'"; '+ // the second app url 'f.method="POST"; '; s := s+ 'var i=document.createElement("input"); '+ // url_submit 'i.type="hidden"; '+ 'i.name="data_event"; '+ 'i.value="'+TNetEncoding.Url.Encode(data_event)+'"; '+ 'f.appendChild(i); '; s := s+ 'document.body.appendChild(f); '+ 'f.submit(); '; UniSession.AddJS(s) end else UniSession.UrlRedirect(UniMainModule.Url_submit+'&data_event='+TNetEncoding.Url.Encode(data_event)); end; end; Ajax Event that intercept CallBack procedure TUFmLoginm.UnimLoginFormAjaxEvent(Sender: TComponent; EventName: string; Params: TUniStrings); var jsonResponse, aURL : string; credentials : TLoginCredentials; begin if (EventName = 'loggedwithcredentials') and (Params.Values['RES']='OK') then begin if not Params.Values['data_event'].IsEmpty then begin // elab .... frmPinm.Hide; ModalResult := mrOK finally credentials.Free end end end end; All works fine except AjaxEvent that doesn't intercept the EventName "loggedwithcredentials".

Hello, I use TUnimDbListGrid to show a personal view of my data but I don't understand why my array doesn't show correctly : On the ClientEvent / beforeInit I have function beforeInit(sender, config) { var htmlRow= '<table style="width: 100%; height: 100%; vertical-align: middle;"> '+ '<tbody> '+ '<tr> '+ '<td><span style="fon-weight: bold; color: #000000; font-size: 16px; width: 100%; display: inline-block;">{2}</span> <span style="color: #808080; width: 100%; font-size: 13px; display: inline-block;">{1}</span></td> '+ '<td style="width: 100px;"><span style="color: #ff6600;">{0}</span></td> '+ '<td style="width: 100px;"><span style="color: #ff6600;">{0}</span></td> '+ '</tr> '+ '</tbody> '+ '</table> '; config.itemTpl= new Ext.XTemplate(htmlRow); } The result is like this and not with align : Somebody can help me (V7.0.0, Delphi 10.4)

Good afternoon, I would like to change the colors of the buttons of a mobile Upload Dialog as well as the text "browse" (of one button), which seems also to be standardized. Can anyone help me with the CSS and the Delphi Calls, I need? Thanks a lot in advance.

Dear all, Is there anyway to access and create appointment in local mobile calendar ?. our application need to create appointment in mobile calendar and will trigger the reminder alert. We are using for Mobile version ( touch version ) I am using unigui 1.90.0.1547

Hi everyone! I'm kind of new into mobile development using framework Unigui in this current version (Trial 1.90.0.1520 - Equinox). So i was searching in forum about a doubt that was not resolved it at all, and i didn't find any answers that could helping me to find a clearly solution. But here in fact: - I have a Container Panel with alignment property (AlClient) defined. And inside him i have another UnimPanel form (again, with property Alclient defined) and a lot of components inside of them, like a UnimEdit, UnimCheckbox, Grid, etc... So, which property i have to use to, when i have more components inside that panel, he can dinamically adjust itself, besides i don't have to set a fixed height to my form? - Sorry if i posted in the wrong section or i don't used it correctly enough. I'm open to suggestions or links that could help me! Thanks.

Using a PIN -Personal / (or sometimes, Private) Identification Number- is an additional security factor for transactions and serves as a simple way to add an extra layer of authentication or access management. A PIN is usually made up of a few (4-6) numeric digits that are easy to remember. And generally a PASSWORD and a PIN are used together: the password being to initiate an operation (access an application) and the PIN to authorize various operations within the application. This example shows how to use a PIN without using your device's numeric virtual keypad. That is, the example provided here is in its nature indicated for use on mobile. However, it can be used in the same way for Desktop, but I don't think it would make much sense. Download more examples from https://t.me/uniguiexpress See this and many other projects on our website https://www.unigui.com.br/democetera/pack4.html for sale. More content Packs of Projects, Books and Services at http://www.unigui.com.br/

I'm trying to get some data from a mobile application, but the user's browser, version and operating system does not return procedure TMainmForm.UnimFormShow(Sender: TObject); var C : TUniClientInfoRec; SessionID:String; IPAddress:String; BrowserType: string; BrowserVersion: Integer; OSType: string; begin SessionID:=UniApplication.UniSession.SessionID; IPAddress:=UniApplication.RemoteAddress; C:=UniApplication.ClientInfoRec; BrowserType:=C.BrowserType; BrowserVersion:=C.BrowserVersion; OSType:=C.OSType; criaArquivoLog('Browser: '+BrowserType); criaArquivoLog('vVersaoBrowserUsuario: '+IntToStr(BrowserVersion)); criaArquivoLog('vSOUsuario: '+OSType); criaArquivoLog('SessionID: '+SessionID); criaArquivoLog('IPAddress: '+IPAddress); end; this is my return

Hi Everyone! I'm using the component UnimDBGrid to create some ListView according to this tutorial created by Mohamad Sadek. But, unfortunately, seems not working using UnimDbGrid, under the BeforeInit Event... The Grid seems not to render the custom html... What could possible i can do for this? Ps: see the attachment below. Thanks!

A simple example to generate alert and vibration beeps on smartphones. It works on all browsers except the most exotic. Download only allowed for subscribers of uniGUI. Subscribe to our Telegram channel below to access this and other examples. http://www.uniguiexpress.com Our group at Telegram: https://t.me/uniguiexpress same content in inglês. Um exemplo simples para gerar beeps de alerta evibração em smartphones. Funciona em todos os browsers menos os mais exóticos. Visite http://www.unigui.com.br/ Nosso grupo no Telegram: Livros, packs de projetos, cursos, serviços, consultoria e tudo sobre unigui ! https://t.me/uniguiBrazil Project available at http://unigui.express

Hi everybody, I wonder if it's possible to remove the clear button on the TuniDBNumberEdit and TuniDBFormattedNumberEdit. I could not find properties for this. I am using the controls in the web form and mobile form. The button will show as i start typing and in the textbox. Best regards Christian

Hi Everyone! UnimDbListGrid has a option that allow the users to navigate between pages in WebOptions -> Paged -> PageSize. But, it will be much better if can display some buttons to go to the next and previously page, indeed. I already have tested UnimDBNavigator and unfortunately only have buttons to go to the last and first page. There's another option or workaround that implements a button to go to the next page (not the last one) using this component on UnimdbListGrid? Thanks!!

Hi everyone! I'm trying to change TabBarVisible property of UnimTabPanel by false but it's not working anymore in version 1.90.0.1535. In previously version was (1531), but now don't. And later i use the sample which i think it will work, but unsunccesfully: UniSession.AddJS(UnimTabPanel.JSName + '.tabBarVisible.Hide();'); or these one into befoneInit event's: function beforeInit(sender, config) { tabBarVisible = Hide; } But, unfortunately, none of these above has worked. Is there any workaround for this, or link i don't see in post's before? Really appreciate any help!

A simple example of in APP to dial on Mobile (SmartPhone / Tablets). with

Olá pessoal! Estamos com um problema ao colocar um scroll e rolar a pagina para baixo o componente htmlframe fica parado sem rolar junto com os demais elementos. Link para o vídeo mostrando o erro --- > http://www.grsoft.com.br/videos/VideoErroScroll.mp4 Agradecemos quem poder ajudar!

The components UnimEdit and UnimNumberEdit do not seem to have a text alignment property. How do I change the text to be right-aligned?

Hi there! Recently i have updated my Unigui to the version 1.90.0.1496. All the CSS and customizations i had before, is not truly working anymore. So, basically i had the CSS tags on ServerModule -> CustomCSS. And in my UnimButton -> ExtEvents (added or painted). But anyone of these not worked. Anyone had the same problem? Thanks anyway!

I am using a mobile form in non-fullscreen mode and I want it to show at top of screen. It looks like mobile forms default to PoScreenCenter mode and there is no way to change this. The position property is not accessible. Is this a bug?

I'm trying to use socket.io on unigui mobile, but it is not working, I would like some help, attached the source of an example with video, showing how to start the socket. The application was opened in 2 different tabs on the web to show that they communicate and the application was also opened in chrome on the desktop, switching to mobile where it worked, however opening the application in chrome on the phone does not work, the phone was mirrored on the computer to understanding.... Gravar_2020_02_12_10_40_17_623.mp4 HibridoSocket.rar