Results 1 to 4 of 4

Thread: [Answers] UI

  1. #1
    Lianja MVP
    Join Date
    Dec 2012
    Location
    Croatia, Zagreb
    Posts
    1,135

    [Answers] UI

    There are a wide range of transitions that you set for individual pages.




    Q:
    I have a page with a single calendar section and I have set the page transition effect to "Flip"
    However, I do not see the expected flip when I use Lianja.showdocument() to display the calendar page
    May I know what other attributes I need to set to make the transition effect work?
    A:
    Page transitions are only effective in Web/Mobile Apps. The attribute is ignored in Desktop Apps.



    Q:
    I need to sound a short alarm or beep to user at invalid input
    A:
    I have added Lianja.beep() into v1.3RC6.



    In v1.3RC5 there is a new App delegate called "Inactive" and an attribute "Inactive interval". The delegate is called if there have been no user input events (key press, mouse click or touch event) for the specified number of seconds. You can then issue a Lianja.home() to return to the app center, Lianja.logout() to log the user out or Lianja.showdocument() to switch to another page.
    This only operates in runtime mode not development mode.



    I've added a new function inputEvents() to v1.3.
    It returns the number of input events i.e. mouse clicks or key presses.
    You can then determine in a timer if there has been no activity and logout or return to the App Center or Page Center (or whatever page you want).
    This can be used to handle Kiosk inactivity timeouts.



    Q:
    [Is it] possible to define hot keys that will perform some specific action for the user such as CTRL-L
    A:
    In a desktop App you can handle hot keys in the "Hotkey" delegate which is passed the name of the function key pressed e.g. "F2" "Ctrl+F2" "Shift+Ctrl+F2" etc.
    Control keys are operating system and GUI UI control dependent and cannot be used for that purpose in most GUIs.
    e.g.
    F2
    Ctrl+F2
    Shift+F2
    Ctrl+Shift+F2



    Q:
    Is there a similar ability to test for a formitem.Visible ?
    A:
    Code:
    if Lianja.get("page1.section1.field1").visible
    // do something
    endif


    Q:
    What is the best way to test to see if a page (full page edit = .T.) & therefore the sections are in editmode.
    A:
    Code:
    if Lianja.get("page1.section1").editing
    //
    endif


    Q:
    in the console under the javascript page,
    Code:
    Lianja.showMessage("test");
    works as I would expect. However,
    Code:
    Lianja.messagebox("test");
    is throwing an error.

    A:
    messageBox() is not a Lianja method, it's a normal VFP function available in JavaScript so remove the Lianja.



    Q:
    Well, I need show a diferent message in the label, for each case of result, from the user activity.
    Depending the user activity, we change the text to show.
    A:
    Then use { expression } macros in the caption and just refresh the field.
    Changing the captions with text would be saved with the App and have undesirable affects.




    ​All topics in [Answers] alphabetically:http://www.lianja.com/community/show...ll=1#post12352

  2. #2
    Lianja MVP
    Join Date
    Dec 2012
    Location
    Croatia, Zagreb
    Posts
    1,135
    Q:
    How do you detect if the tab key is pressed in a canvas textbox?
    I tried using ?inkey() in both the changed and interactive events, although neither of them registered a value in the console.
    The value for tab using inkey() should be 9.
    What I want to achieve is if the tab key is pressed in certain textboxes, then I will want to change a tabview section to display a different tab.
    A:
    Use the 'Hotkey' Custom delegate, e.g. for a VFP delegate, this will display the message 'Tab'.

    Code:
    ////////////////////////////////////////////////////////////////
    // Event delegate for 'hotkey' event
    proc page1_section1_field1_hotkey(keyvalue)
    messagebox(keyvalue)
    endproc
    The hotkey pressed is passed to the function, so you can test for 'Tab' and process with if...endif or do case...case...endcase.



    Q:
    how to use Lianja to integrate bar code scanning, utilize touch screen technology, and what is required for the integration of credit card processing.
    A:
    Lianja is touch screen ready out of the box.
    The Lianja C API can be used to extend Lianja to handle serial communications if you need to interface to bar code scanners or credit card processing.
    On windows Lianja supports ActiveX.

    Lianja supports integration of Python from Lianja/VFP there may well be a python library available that provides this functionality also.


    (?A):
    Windows supports ActiveX. The WorthData ActiveX bundle ought to work. It's best to install the whole Update Manager, even though you plan to use only the OCX, because that also installs the highspeed interface, which otherwise you will have to install manually.



    inkey() and lastkey() are very old foxpro functions and are not supported in Lianja.



    Q:
    I tested the Lianja Web UI Demo in desktop and browser view
    I notice that the grid editing behaviour is different when in desktop and browser view
    In desktop view, the grid will split into a form section whereas in browser view, the grid fields will be displayed in a side panel.
    I checked the custom delegates and the section attributes but could not find any code or attribute that migh have control this.
    May I know if this is a default behaviour for grid editing in browser and mobile apps?
    A:
    that's the way it works. It's a responsive UI that is laid out for the target device.



    Q:
    if I have more fields to fit in the side panel as one of my grid record has about 20 fields including a Notes field, how would Lianja handle this situation especially the Notes field which is a multi line memo field?
    A:
    The fields become scrollable in the dialog panel.
    You would not edit a memo field in a grid like that you would relate it as a separate editable Webview section.
    You just need to think of what the target device will be when you design your App UI.



    Q:
    if it is possible to define hot keys that will perform some specific action for the user such as CTRL-L will list the records of a form section in a grid?
    If this is possible, may I know if the function keys are programmable to perform specific actions?
    A:
    In a desktop App you can handle hot keys in the "Hotkey" delegate which is passed the name of the function key pressed e.g. "F2" "Ctrl+F2" "Shift+Ctrl+F2" etc.
    Control keys are operating system and GUI UI control dependent and cannot be used for that purpose in most GUIs.
    ( hot key delegate on the page level?) Key presses do not propagate up through the UI hierarchy. They are only at the field level.



    ​All topics in [Answers] alphabetically:http://www.lianja.com/community/show...ll=1#post12352

  3. #3
    Lianja MVP
    Join Date
    Dec 2012
    Location
    Croatia, Zagreb
    Posts
    1,135
    Q:
    Is there a way to specify a position of a message box as it displays on the screen?
    I have three questions being asked through message boxes and each message box appears at a different place by default on the screen. I would really just like them to appear in the same place centered.

    A:
    I'm afraid not. That's a native dialog which the operating system decides where it should appear.



    various ways to accomplish UI navigation and highlight which ones are better for cross device UI navigation i.e. Desktop, Web or Mobile.
    http://www.lianja.com/resources/blog...ion-techniques



    Q:
    the Windows 8 or 10 machines that the software will be installed DON'T have keyboards.
    I would like to see a simple one form sample app which demonstrates touch screen data entry with on-screen keyboard support only.
    Numeric keypad will also be needed for the UI.
    A:
    If you build a simple one page app for customers and switch to edit mode, the keyboard will slide up automatically if it's a tablet.
    If it's not a tablet but rather a desktop then this will require some custom development on our behalf.




    Firstly update the registry
    HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\TabletTip\1. 7\EnableDesktopModeAutoInvoke=1
    Then run tabtip.exe like this.

    run cmd /c C:\Windows\WinSxS\amd64_microsoft-windows-tabletpc-inputpanel_31bf3856ad364e35_10.0.14393.0_none_3f03 81418e34f185\tabtip.exe
    This will show the touch keyboard.
    For Windows 8 all you need to do is this.



    Q:
    One of the apps I'd like to create in Lianja for our internal use is for data manipulation. Our daily work currently uses a bunch of Foxpro scripts to parse names and addresses, convert case, standardize and verify addresses, etc.

    The scripts can't catch every variation of things that need to be fixed so after each script I enter various foxpro commands in the command window to browse/edit records to look for things that are missed. Then I can type commands to fix those odd cases.

    If I can include the Lianja console in a data processing app that would be a great app for us.
    Is that possible?
    A:

    Code:
    lc = inputbox()
    if !empty(lc)
       execscript(lc)
    endif

    Substitute a form that has an editbox in it for the input box and you can run multiline commands.
    You can wrap the result in a
    try...endtry to catch any errors.



    Q:
    do you normally use Apps to call other Apps? For Web and Mobile performance, should the app be completely self-sufficient?
    allows the order form to be less complex and allows the complex query form to be used by all forms.
    A:
    Library Pages do exactly what you want here.



    Q:
    I need to create a user interface for a record and want to provide a means for user to attached document to the form record.
    I do not see an
    attachment gadget that I can use. Does this mean I need to create a separate attachment section to the form section even though I only have one attachment per form record?
    A:
    there are a variety of ways a section can be used, including showDialogPanel or a Custom Gadget (https://www.lianja.com/documentation...-visual-foxpro), or simply hiding that section until the user indicates (footer menu perhaps; dialogbutton perhaps) a desire to upload the attachment.
    You can write server-side Lianja/VFP but client code needs to be JavaScript.



    Your imagination is the limit on building beautiful Visual Foxpro Custom sections.
    There is no user HTML in here (The canned graphs are pre-built) and very little CSS.
    You can nest the containers and code away with the VFP code you already know.
    VFP Custom Section - https://youtu.be/nASVLmlKmyY



    Q:
    How do you change the field that the recently viewed section in the left sidebar is pointing to? It was displaying the record ID field, now it switch to showing a zip code field. Unsure how I changed it and unsure of how to get it back. The key and ndx(1) are correct to the ID field.
    A:
    Double click the field that you want Lianja to use as the search field. Then under the data section of the Field Attributes, select "Search Field".



    ​All topics in [Answers] alphabetically:http://www.lianja.com/community/showthread.php?2717-Answers

  4. #4
    Lianja MVP
    Join Date
    Dec 2012
    Location
    Croatia, Zagreb
    Posts
    1,135
    Q:
    in the example_webapp2 app...
    ...In the web client this appears to lock the company name field. The user is no longer able to edit the Company Name field on any record. You have to exit the app or edit the whole page and cancel in order for the field to become editable again.
    Should the navigation buttons be disabled automatically when a field is in edit mode, as is the case when editing a full record?

    A:
    You can disable inline editing in the Web Client. There is an App Setting - the last setting under 'General App Configuration'.



    Q:
    Is there a way to close a browse window using CTRL-W?

    A:
    No, the window corner x is currently the only way to close the window.



    Q:
    I am looking for a list of all available hot keys in Lianja.

    A:
    The Hotkey event delegate is triggered by the function keys, Ins, Backspace, Delete, PgUp, PgDn, Home, End and combinations of these with ctrl, alt and shift.
    https://www.lianja.com/doc/index.php...legates#Hotkey
    There wasn't a definitive list, so I have added these to the Hotkey delegate link.

    A2:
    I am also using Left, Right, Up and down arrows (which are working), so I thought perhaps there were other keys.

    Q3:
    I had missed the hotkey functionality.
    Does this functionality extend to mobile apps? The reason I ask is that "desktop" to us at this point means an Electron app.

    A3:
    Currently desktop (not Electron) only.



    Q:
    How does one set an individual 'form' to be a specific size rather than filling the whole screen

    A:
    custom forms have properties for that.
    Pages themselves always adjust to the geometry of the app. Custom forms exist on their own, in effect outside the page object and the App. Custom sections conform to the page width.
    Custom forms limit your deployment flexibility: ever see a free-floating form on a mobile app?

    A2:
    You just specify the size of the window using showdialog.



    As you can see in the image, I have an app that has a floating window outside the main part of the app.
    in a mobile app, you would have to show the dialog panel with the OnTop parameter set to .F.,



    Q:
    In a canvas section, when a TextBox or NumericTextBox field has Editable = False, the background is greyed.
    1. Is there a reason why this shouldn't be the case for DateTextBox and EditBox fields (or possibly others...haven't tested them all) ?
    2. Is there a VFP equivalent to the Enabled property or is Editable the only option?
    3. Is there a wayto control the Background/Foreground Colors for Non-editable Canvas fields?

    A:
    If you look in the App Settings there is an attribute which specifies the background color of non-editable/readonly fields.
    The Qt UI framework which Lianja uses adapts the controls to the host operating system it is running on. This is so it renders native UI controls whenever available.Some composite UI controls do not have host operating system counterparts so these are custom controls.
    The enabled property is not exposed for design reasons. You should use the editable attribute.
    UI presentation rules can be used to adjust this dynamically depending on the logged in user.



    In Lianja 4.1 I have enhanced the web/mobile framework so that you can embed grids, charts, webviews and pageframes (Tabbed UI) inside a grid cell or FormGrid cell.
    I've also implemented the Lianja/VFP "form", "webview" and "pageframe/page" classes in the web/mobile framework.
    So now it is simple to show a popup window to edit a grid cell or drill down in a management dashboard.
    Here's some example JavaScript code:
    Code:
    f = createObject("form");
    f.caption = "This is a popup form";
    f.resize(1024, 600);
    f.addObject("wv", "webview");
    wv.url = "http://www.lianja.com";
    f.show();
    and the result.



    Clearly using the Lianja Web/Mobile framework is dramatically easier than messing about with HTML/CSS etc and if you have any VFP knowledge you will be right at home with the custom classes available to you.
    Remember also that you can addObject() a "container" to the "form" and give that container a "layout" of "grid", "form", "vertical" or "horizontal". These layouts will help you build responsive UI forms that adjust and lay out their "children" UI components automatically.
    So you can build complex data entry forms and extract the data from the form in the "afterClose()" delegate to update remote data or update the UI and change its state by selecting other pages using Lianja.showDocument() etc.



    Further refinements with custom classes.
    Form
    Grid
    Pageframe/Page (tabs)
    Webview
    are now all available in the Web/Mobile client.
    Pageframe handles the new "tabposition" property:
    tabposition (can be "north", "south", "east" or "west" same as in desktop).



    Here is the JavaScript code for that dialog.
    Code:
    f = createObject("form");
    f.addObject("pf", "pageframe");
    pf.addObject("tab1", "page");
    pf.addObject("tab2", "page");
    pf.addObject("tab3", "page");
    tab1.addObject("wv", "webview");
    wv.url = "http://www.lianja.com";
    pf.tabposition = "south";
    f.show();
    You can handle Tab navigation yourself to stack up a lot of panels in the UI and raise one into view:
    Code:
    pf.tabbarvisible = false;
    
    // select tab1
    pf.activatepage = 0;
    // or
    pf.select("tab1");
    To provide a better mobile experience you can set the mobilefullscreen form property to true. This is ignored unless the App is running on a phone. On a phone this maximizes the form into the viewport of the phone and removes the border.
    Note that you can show the form fullscreen on all devices by setting the "fullscreen" property to true.
    Code:
    f = createObject("form");
    f.addObject("pf", "pageframe");
    pf.addObject("tab1", "page");
    tab1.addObject("wv", "webview");
    wv.url = "http://www.lianja.com";
    f.fullscreen = true;
    f.show();


    Q:
    accepted (a property). You describe the events. I can guess what "accepted" means but thought I'd ask just to confirm.

    A:
    Its a property that is true by default.
    You can set it to false in the beforeClose() event to stay in the form if validation fails.



    Q:
    can setAttribute() be used to change an app attribute?

    A:
    setAttribute() as documented is only relevant to UI page, section, formitem... not App.




    All topics in [Answers] alphabetically: https://www.lianja.com/community/sho...ll=1#post13748

    These answers are also systematized on the site "Lianja developer": https://lianjadeveloper.wordpress.com/category/ui/

Bookmarks

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
Journey into the Cloud
Join us