Render a long string

Former Member over 10 years ago

Hi,

I want to render a String which is
- not hardcoded but retrieved (so no hardcoding)
- longer then can be displayed in a single line.

So what I would need to do is:
- figure out how many characters would fit in a single line of the display
- include line breaks into the String (actually without breaking words would be great)

Any idea if there is something available, or would this to be implemented custom?

Best,
Stefan

Former Member over 10 years ago

how about

function splitString(dc, font, str, margin){

    var width = dc.getWidth() - margin * 2;
    var strLen = str.length();
    var firstChar = 0;
    var lastChar = 0;
    var newStr = "";

    if(strLen == 0){return "";}

    for(var i = 0; i <= strLen; i++) {
        var char = str.substring(i, i + 1);
        if(char.equals(" ") || i == strLen){
            if(dc.getTextWidthInPixels(str.substring(firstChar, i), font) < width){
                lastChar = i;
            }
            else {
                newStr += str.substring(firstChar, lastChar) + "\n";
                firstChar = lastChar + 1;
            }
        }
    }
    newStr += str.substring(firstChar, strLen);
    return newStr;
}

Former Member over 10 years ago

Nice - works for me. Many Thanks!
Would be good to have things like that in a library.
Next thing for me to figure out is how to build a screen, which allows vertical scrolling of the text ..

Former Member over 10 years ago

Want a hint?

Former Member over 10 years ago

Yes, hints are always welcome.
I just started playing with the SDK to understand what is possible...

Former Member over 10 years ago

//View
hidden var mYOffset = 0;

function scrollUp(){
    mYOffset -= 5;
    requestUpdate();
}


function scrollDown(){
    mYOffset += 5;
    requestUpdate();
}

function onUpdate(dc) {
    // add mYOffset to every Y value you want to scroll
    dc.drawText(x, y + mYOffset, font, msg, just);
}


// Input Delegate
function onKey(event) {
    if(Ui.KEY_DOWN == event.getKey()) {
        App.getApp().mView.scrollUp();
      }
      else if(Ui.KEY_UP == event.getKey()) {
        App.getApp().mView.scrollDown();
      }
    return true;
}

Former Member over 10 years ago

Hi,

thanks for this - you are quite fast with your replies.
I think this would only work for an app and not for a widget, as widgets are binding the UP and DOWN key to flipping through the different widget.
Right now I'm looking at a widget. One idea would to copy the behaviour of the weather widget.
Present a "screen" in the widget carousel which opens a view if the customer hits the start stop screen. For the latter one, your proposal should be working, I assume ...

Best,
Stefan

Former Member over 10 years ago

Hi,

I used input example as a guidance and now I'm able to have a second view and can use your scrolling code. Works like a charm.
The only issue I have right now is that I can't hold state in the view itself.

If I create mYOffset inside the view, I can increment/decrement the value, but in the onUpdate() function the value is always 0. I moved the value to a model attached to the App (like in the weather example) which now "works" for me.

For sure something stupid on my side ...

Best,
Stefan