facebook

dynamic content area height in panels

  1. MobiOne Archive
  2.  > 
  3. Getting Help – General
Viewing 15 posts - 1 through 15 (of 19 total)
  • Author
    Posts
  • #328237 Reply

    dabbelju
    Member

    Hi all,

    I have a panel which can be scrolled. Depending on the screen, I have more or less items to show in that panel. Is there any way to make the content area hide dynamic?

    best
    dabbelju

    #328352 Reply

    dabbelju
    Member

    No ideas? 🙁

    #328374 Reply

    Hi dabbelju,

    What kind of items are you adding to your panel? Are they listItems or similar? Or they are a mix of widgets?

    #328377 Reply

    dabbelju
    Member

    Hi Octavio,

    just listItems. No mix of items.

    Thanks
    dabbelju

    #328596 Reply

    Hi dabbelju,

    After calculate your content area height you should use this snippet:

    $(“#m1-project-panelname-scroller”).height(panelHt);

    Let me know how it goes. If necessary I can share an example.

    #328620 Reply

    torybash
    Member

    Hi octavio,

    I have this problem too. However I can easily use

    $("#m1-project-panelname-scroller").height(panelHt);

    to adjust a panels height, but inside the panel I’ve got a text widget with a variable size (the text is retrieved from an RSS-feed).

    Is there some way to retrieve the height (or number of lines) of a text-widget?
    I’ve tried using

    $('#m1-main-text').height();

    but this only returns the height set in MobiOne.

    Thanks,
    torybash

    #328656 Reply

    Hi torybash,

    I’m not sure if I saw in the populate custom list example of Wayne or other projects, a possible workaround would be create a sub string of your text widget. That will do all your text widgets have the same height.

    See: http://www.w3schools.com/jsref/jsref_substr.asp

    Anyways, I’ll ping tomorrow the dev team to know their opinion.

    #328695 Reply

    dabbelju
    Member

    Hi octavio,

    it does not work for me. I did play arround with it and I can set the panel’s height through this, but not the “scrollers” height.

    I think it does not work, cause it comes as inline style and I think I can not overwrite it.

    Any other ideas?

    best
    dabbelju

    #328723 Reply

    dabbelju
    Member

    Hi octavio,

    Just for information: I did try also this, without success.

    $(‘#m1-spielplan_overview-panel1-scroller’).css(‘height’, ’20px’);

    best
    dabbelju

    #328950 Reply

    dabbelju
    Member

    Hi,

    just wanted to say, that I got arround the problem. When I took a look at the dom inspector, I did recognize, that the setting was there, but somehow overwritten. So I added the following:

    $(‘#m1-spielplan_overview-panel1-scroller’).css(‘height’, ’20px !important’);

    and it works now for me.

    Thanks and best
    dabbelju

    #341954 Reply

    bmvankessel
    Member

    This only works in the Test Center when followed by phoneui.forceLayout. After building and downloading the app to my android phone it did not work anymore. So there must be a slight difference between the Dev Center and Cloud environment. Any other suggestions?

    #341971 Reply

    Hi bmvankessel,

    Can you share a sample project that demonstrate the issue? After reviewing it we can give you an advice.

    #342334 Reply

    Unknown Author
    Participant

    I have this issue now too, under 2.9. Never had this happen under 2.2.

    #342364 Reply

    Hi 1thinchip,

    Can you share a sample project that demonstrate the issue? Does it happen on android, iOS, Test Center, Web SIM? Also, since this thread discusses resizing panel and someone else is dicking with scroller via css, can you share details about the problem you are having?

    #343816 Reply

    lemorlenny
    Member

    @support-octavio wrote:

    Hi 1thinchip,

    Can you share a sample project that demonstrate the issue? Does it happen on android, iOS, Test Center, Web SIM? Also, since this thread discusses resizing panel and someone else is dicking with scroller via css, can you share details about the problem you are having?

    Hi Octavio,
    I have same problem when I try to resize the panel scroller height, it works fine in development but not when installed on device, have some workaround?

    Regards

    Android JellyBean 4.2.2
    Mobione 2.3.2(1,20130425)

    
    
    function PrepareList(Result) {
      
      // call the page
      phoneui.gotoPage("m1-ListC",phoneui.transitions.slideLeft);
    
      var list = $('#m1-ListC-list1');
      
      $(list).empty(); // clear list
    
      // data separator pipe
      var aResult = Result.split("|"); 
    
      for(idRow = 0; idRow < (aResult.length-1); idRow ++) {
        // fields separator comma
        aRowElements = aResult[idRow ].split(",");
        
        var url_logo = aRowElements[11]+'" alt="testo" width="'+((parseInt(myWidth)/100)*40)
       
        var id = "m1-ListC-listItem1" ; 
    
        $(list).append(
    
                  '<li id="m1-ListC-listItem1" class="' + (idRow  == 0 ? 'm1-first' : '') + (idRow  == (aResult.length - 1) ? 'm1-last' : '') + 
                  'm1-clickable m1-article-listItem m1-highlight m1-background-4 m1-background-5 m1-background-6" IdCenter='+aRowElements[0]+'>'+
                    '<div id="m1-ListC-txtCenterName" class="m1-text m1-font-3 m1-active-color-1">'+aRowElements[1]+'</div>'+
                    '<img id="m1-ListC-imgCenter" class="m1-clickable m1-image" src="'+url_logo+'"/>'+
                    '<div id="m1-ListC-txtCenterSite" class="m1-text m1-active-color-1 m1-font-4">'+aRowElements[3]+" ("+aRowElements[5]+")"+'</div>'+
                  '</li>'
        );
      }      
    
    
      // *************
      // - THIS SECTION WORKS ONLY IN DEVELOP ENVIRONMENT
      // set the panel height according to the rows number
      var PanelH=70*(idRow);
    
      $('#m1-ListC-panel1-scroller').css('height', PanelH+'px !important');
      // *************
        
    
      phoneui.preprocessDOM(list);  
      phoneui.hideActivityDialog();
    
      //add click handler to all list-items
      var listItems = $(list).children();
      
      $.each(listItems, function(i,listItem) {
        $(listItem).click(function(e) {
          var idx = parseInt($(this).attr("IdCenter"));
            CenterPage(idx);
        }); 
      });
    } 
    
    
Viewing 15 posts - 1 through 15 (of 19 total)
Reply To: dynamic content area height in panels

You must be logged in to post in the forum log in