Alpha Software Mobile Development Tools:   Alpha Anywhere    |   Alpha TransForm subscribe to our YouTube Channel  Follow Us on LinkedIn  Follow Us on Twitter  Follow Us on Facebook

Announcement

Collapse

The Alpha Software Forum Participation Guidelines

The Alpha Software Forum is a free forum created for Alpha Software Developer Community to ask for help, exchange ideas, and share solutions. Alpha Software strives to create an environment where all members of the community can feel safe to participate. In order to ensure the Alpha Software Forum is a place where all feel welcome, forum participants are expected to behave as follows:
  • Be professional in your conduct
  • Be kind to others
  • Be constructive when giving feedback
  • Be open to new ideas and suggestions
  • Stay on topic


Be sure all comments and threads you post are respectful. Posts that contain any of the following content will be considered a violation of your agreement as a member of the Alpha Software Forum Community and will be moderated:
  • Spam.
  • Vulgar language.
  • Quotes from private conversations without permission, including pricing and other sales related discussions.
  • Personal attacks, insults, or subtle put-downs.
  • Harassment, bullying, threatening, mocking, shaming, or deriding anyone.
  • Sexist, racist, homophobic, transphobic, ableist, or otherwise discriminatory jokes and language.
  • Sexually explicit or violent material, links, or language.
  • Pirated, hacked, or copyright-infringing material.
  • Encouraging of others to engage in the above behaviors.


If a thread or post is found to contain any of the content outlined above, a moderator may choose to take one of the following actions:
  • Remove the Post or Thread - the content is removed from the forum.
  • Place the User in Moderation - all posts and new threads must be approved by a moderator before they are posted.
  • Temporarily Ban the User - user is banned from forum for a period of time.
  • Permanently Ban the User - user is permanently banned from the forum.


Moderators may also rename posts and threads if they are too generic or do not property reflect the content.

Moderators may move threads if they have been posted in the incorrect forum.

Threads/Posts questioning specific moderator decisions or actions (such as "why was a user banned?") are not allowed and will be removed.

The owners of Alpha Software Corporation (Forum Owner) reserve the right to remove, edit, move, or close any thread for any reason; or ban any forum member without notice, reason, or explanation.

Community members are encouraged to click the "Report Post" icon in the lower left of a given post if they feel the post is in violation of the rules. This will alert the Moderators to take a look.

Alpha Software Corporation may amend the guidelines from time to time and may also vary the procedures it sets out where appropriate in a particular case. Your agreement to comply with the guidelines will be deemed agreement to any changes to it.



Bonus TIPS for Successful Posting

Try a Search First
It is highly recommended that a Search be done on your topic before posting, as many questions have been answered in prior posts. As with any search engine, the shorter the search term, the more "hits" will be returned, but the more specific the search term is, the greater the relevance of those "hits". Searching for "table" might well return every message on the board while "tablesum" would greatly restrict the number of messages returned.

When you do post
First, make sure you are posting your question in the correct forum. For example, if you post an issue regarding Desktop applications on the Mobile & Browser Applications board , not only will your question not be seen by the appropriate audience, it may also be removed or relocated.

The more detail you provide about your problem or question, the more likely someone is to understand your request and be able to help. A sample database with a minimum of records (and its support files, zipped together) will make it much easier to diagnose issues with your application. Screen shots of error messages are especially helpful.

When explaining how to reproduce your problem, please be as detailed as possible. Describe every step, click-by-click and keypress-by-keypress. Otherwise when others try to duplicate your problem, they may do something slightly different and end up with different results.

A note about attachments
You may only attach one file to each message. Attachment file size is limited to 2MB. If you need to include several files, you may do so by zipping them into a single archive.

If you forgot to attach your files to your post, please do NOT create a new thread. Instead, reply to your original message and attach the file there.

When attaching screen shots, it is best to attach an image file (.BMP, .JPG, .GIF, .PNG, etc.) or a zip file of several images, as opposed to a Word document containing the screen shots. Because Word documents are prone to viruses, many message board users will not open your Word file, therefore limiting their ability to help you.

Similarly, if you are uploading a zipped archive, you should simply create a .ZIP file and not a self-extracting .EXE as many users will not run your EXE file.
See more
See less

Programmatically resize a panel card

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Programmatically resize a panel card

    I have an editor set that drops down in a panel (TTB panel card layout). The panel card as a defined size. This works great for a text field editor

    How can I programmatically resize the HEIGHT of that panel card if the editor is a text area field or an editor list?

    In the SHOW EDITOR in the editor properties I have tried getting a pointer to the panel object and using the resize option, but I lose the horizontal settings and the panelcard resizes both vertically and horizontally.

    I can use the onSize event in the panel card and I am guessing that is what I need to focus on? Just not sure how to pass values to it if a particular editor is used

    In looking at the responsive layout rules, I can resize the panel based on screen size, etc, so I know there is a way to do it, but I cant see the javascript invoked with that responsive layout setting....or at least I haven't found a way to do so.

    Trying to keep things as minimal as possible and don't want to add additional editor sets and panel cards if I can help it.

    Thanks in advance for any assistance you might provide.
    Last edited by gregincolumbus; 04-18-2018, 12:23 PM.

    #2
    Re: Programmatically resize a panel card

    Is it the PanelCard "Layout size" property you want to be variable... depending upon the Editor being displayed? E.g. an Editor showing a KeyPad will need more room than an Editor showing a TextBox.

    I think you'll need to get Alpha to have a look at this one. The whole process of Editors is so convoluted... so many bits and pieces involved... that changing one area will destroy another.

    Alpha probably has an answer for this.

    Comment


      #3
      Re: Programmatically resize a panel card

      Hi David...thank you for taking the time to reply. Here is a quick screencast of what I want it to do

      Video

      Basically I want the panel card that holds the editor to resize based upon the editor for the field being viewed. Hard to put in words but the video shows what I mean.

      I would think this would a common need for those trying to avoid the back and forth panel swaps for a phone when doing CRUD operations. The drop down pc keeps the editor above the soft keyboard on a phone but it needs flexibility to allow the next/previous option to work with changing editors.

      Comment


        #4
        Re: Programmatically resize a panel card

        I figured that's what you were after. That height is controlled by the PanelCard Layout size property. That size is picked up by the Editors and used in a "translate3d" transformation. Your size is probably set at 150px. I don't know if there's a proper way to get this done. It seems to me that the PanelCard should resize according to what's coming in... but it looks like Alpha didn't think that far ahead.

        Here's a brute force way to do this. I'd still contact Alpha, if I were you, and ask about how to do this properly. If the solution is currently within Alpha... it's nicely buried.

        The code below is specific to my UX... so you need to get your Panel names right for this to work.

        In the EditorSet Show Javascript event for the TextBox Editor... I have...

        Code:
        {dialog.object}.panelSetActive('PANELCARD_2');
        {dialog.object}.editorCancel('EDITORSET_2');
        
        var transProp = $("{dialog.ComponentName}.R1.PANEL.1.BODYINNER").style.transform;
        var transArr = transProp.split(",");
        var transHeight = transArr[1];
        
        if(transHeight == " 450px"){
        	$("{dialog.ComponentName}.R1.PANEL.1.BODYINNER").style.transform = "translate3d(0px, 150px, 0px)";
        	$("{dialog.ComponentName}.R1.PANEL.1.PANEL.0").style.transform = "translate3d(0px, -150px, 0px)";
        	$("{dialog.ComponentName}.R1.PANEL.1.PANEL.0.BODY").style.height = "150px";
        }
        All my code is the code after the setActivePanel method... which was already in place.
        This code closes a potentially open EditorSet_2 (my EditorSet for a NumberPad). The code then gets the Transform settings for the Panel. I need to reset the Panel back to 150px if it has been increased by some other EditorSet.

        Here the code for my second EditorSet (my Editor for a NumberPad). The NumberPad must be set to a height of 450px in order to for the full NumberPad to show.

        Code:
        {dialog.object}.panelSetActive('PANELCARD_2');
        {dialog.object}.editorCancel('EDITORSET_1');
        setTimeout(function(){
        	$("{dialog.ComponentName}.R1.PANEL.1.BODYINNER").style.transform = "translate3d(0px, 450px, 0px)";
        	$("{dialog.ComponentName}.R1.PANEL.1.PANEL.0").style.transform = "translate3d(0px, -450px, 0px)";
        	$("{dialog.ComponentName}.R1.PANEL.1.PANEL.0.BODY").style.height = "450px";
        },50);
        Here I am cancelling a potentially open EditorSet_1, and then resizing the Panel to accomodate the Number Pad. I put it within a slight setTimeout Delay so that it's not just "popping" into view.

        Here's a video of what all this looks like... http://youtu.be/y_QMBTJYQmQ?hd=1

        Comment


          #5
          Re: Programmatically resize a panel card

          Hi David,

          Thanks so much for the assistance…... I was definitely looking in the wrong spot on how to solve this.

          I just watched the video and this is exactly what I am looking for…..I will dig into the code so that I have an understanding of how it works. Will also reach out to Alpha…seems like this would be a common need for those developing for phones and trying to minimize the weight of the UX for CRUD operations.

          I appreciate your willingness to help!

          Greg

          Comment

          Working...
          X