Search code examples
javablackberryjava-melistfield

Customizing parts of a listfield

I have been working on a small application and this section of it has stumped me. I have a listField (as seen above the buttons in the screenshot), some buttons, and some static editFields on this page, and I am having trouble with scrolling.

I want the listField to be limited to displaying 5 rows (it is displaying 2 in the screenshot), and if there are more than 5 items in the listField, to be able to scroll through them (not scroll the whole page, just the listview).

I also have another issue with the editFields, if they become too large due to large amounts of text they will disappear off the screen, as my Screen will not run without a call to super(Manager.NO_VERTICAL_SCROLL); which is apparently needed for the listField to work.

Is the only solution to this problem to implement a complete custom class of listField? Or is there a simpler alternative?

(Screenshot on imgur because I don't have enough rep to post images) https://i.sstatic.net/GFxoy.jpg

Thanks, Quinn

EDIT:

public class TestScreen extends MainScreen{
public TestScreen(){
    //Without this call to super (which turns off vertical scrolling) the program throws an IllegalStateException and won't open the screen
    super(Manager.NO_VERTICAL_SCROLL);

    //Create some managers to organize the different Fields
    VerticalFieldManager verticalAllManager = new VerticalFieldManager();
    VerticalFieldManager verticalInfoManager = new VerticalFieldManager();
    //Going to use this to limit the number of rows the list will display
    VerticalFieldManager verticalListManager = new VerticalFieldManager()
    {
        protected void sublayout(int width, int height) {
            //Just test numbers
            super.sublayout(width, 100);
        }
    };
    HorizontalFieldManager horizontalButtonManager = new HorizontalFieldManager();

    //Add a title bar
    add(new LabelField("Choose the call you want to view", LabelField.FIELD_HCENTER));
    add(new SeparatorField());

    //Creates the SimpleList ListField
    Manager mainManager = getMainManager();
    final SimpleList listField = new SimpleList(mainManager);

    //Add items to the listField
    listField.add("Time: 12:30 | Date: 3:10:2014");
    listField.add("Time: 03:13 | Date: 1:25:2013");

    //Creates a button to use for selecting the desired call
    final ButtonField selectCall = new ButtonField("Select Call", ButtonField.CONSUME_CLICK);

    //Creates fields for all the required information (blank to start)
    final BasicEditField timeField, dateField, numberField, nameField;
    timeField = new BasicEditField("Call Time: ", "");
    dateField = new BasicEditField("Call Date: ", "");
    numberField = new BasicEditField("Call Number: ", "");
    nameField = new BasicEditField("Caller Name: ", "");

    //Creates a button that can be used to save changes
    final ButtonField saveChanges = new ButtonField("Save Changes", ButtonField.CONSUME_CLICK);
    final ButtonField deleteRow = new ButtonField("Delete Call", ButtonField.CONSUME_CLICK);

    //Adds all the info fields into a vertical manager to organize them
    verticalInfoManager.add(timeField);
    verticalInfoManager.add(dateField);
    verticalInfoManager.add(numberField);
    verticalInfoManager.add(nameField);

    //Adds the 3 buttons to a horizontal manager to lay them out in a row
    horizontalButtonManager.add(selectCall);
    horizontalButtonManager.add(saveChanges);
    horizontalButtonManager.add(deleteRow);

    //Add the horizontal button manager to the vertical page manager
    verticalAllManager.add(horizontalButtonManager);

    //Add the vertical info manager to the vertical page manager
    verticalAllManager.add(verticalInfoManager);

    //Add all the managers, under the page manager, to the page
    add(verticalAllManager);

}

}

Here is the sample page I have added, along with another screenshot of how it looks when it is run: http://imgur.com/xtPNr7p

The biggest problem right now is that the call to super() with NO_VERTICAL_SCROLL turns off scrolling for the entire page. Without that call, The info Fields would scroll, and I would simply (I think so) need to add the verticalListManager and horizontalButtonManager to a banner to keep them from scrolling away.

Solution

  • Sorry, only a partial answer since it is well past my bed time ....

    ListField does not require NO_VERTICAL_SCROLL, though some of the newer UI Controls do seem to. I avoid these....

    The way to restrict ListField to just displaying 5 'rows' is to put it in a scrolling VerticalFieldManager, and then limit the size of the VFM to the size required to display 5 rows.

    To limit the size, you should override sublayout for the VFM, I've not done this recently, but I think it is as simple as just invoking super.sublayout with the width that was passed in and the height restricted.

    To understand what this is doing, review these two KB articles:

    Custom layout manager

    Extend Manager

    If this does not work, please paste in sample code that we can then 'fix' to show this working. Basically create a simple and standalone MainScreen with a ListField and buttons and EditFields that demonstrate the problems you have identified, paste this in along with another screen shot, and I am sure someone here will create a corrected version of the code for you.

    Update

    Ah, I see you have used one of the newer UI classes, SimpleList, and to my mind, some of these have not been coded correctly, because, as you have found out, they do require NO_VERTICAL_SCROLL. I suspect if you actually added them to a non scrolling VFM that had fixed height, then the processing might work the way you want. But for me, there is no choice here, I would code up a normal ListField, The new UI controls seem to have other restrictions as well, and for me the simplification that they provide just hides functionality that I like to use.

    Anyway, I think you have three options: 1) Add your Edit Fields to the Status area (setStatus(...)) - then they will stick on the bottom of the screen. Add your title label to the title area (setTitle(..)). Then let your calls scroll in the middle. 2) Try to put your SimpleList into a non scrolling but height restricted VFM. 3) Change your SimpleList to an ordinary ListField.

    That said, the Ui that you have chosen seems to me to be problematic for non touch screen phones. How can a user on a trackpad only device select a call? I would look at using the menu to provide 'buttons' for the selected row. To edit a row, use a popup screen with the details.

    So while I am happy to try to help with one of the options above if you decide which one you want to try, I would first caution you to test out this design more to make sure it works.