Your Digital Media Has Never Looked So Good

Topic Author
Posts: 11
Joined: Tue Jul 16, 2019 8:13 am

Label List Vertical Text Alignment

Thu Aug 08, 2019 10:45 am

I have a LabelList of buttons and have a focusBitmapURI png file for the button shape/color.  I'm trying to get the text that displays on top of the focusBitmapURI to be vertically centered.  When I print out the UserButtons  (see code below) in the debug console, there clearly is a field for vertTextAlign, which I'm setting to "center", but this has no effect on the vertical alignment of the text over the focused button.  No matter what I do, the text remains "top" aligned.

Below is the XML code for the LabelList component.

    <!-- Control buttons (Button List) -->
      textVertAlign = "center"
      itemSize="[300, 35]" />

In BrightScript I assign the buttons their text with this code:
  for each button in ["My Profile","Change User","Add New User","Delete User" ,"OK"]
    result.push({title : button})
  end for
  m.buttons.content = ContentList2SimpleNode(result)

I fetch the UserButtons component in the screen init() function as follows:
  m.buttons ="UserButtons")

Printing m.buttons in the debug console yields this printout:
Brightscript Debugger> ? m.buttons
<Component: roSGNode:LabelList> =
    color: 602724351
    focusedColor: 858993663
    focusedFont: <Component: roSGNode:Font>
    font: <Component: roSGNode:Font>
    textHorizAlign: "left"
    textVertAlign: "center"
    animateToItem: -1
    columnSpacings: <Component: roArray>
    columnWidths: <Component: roArray>
    content: <Component: roSGNode:ContentNode>
    currFocusColumn: -1
    currFocusFeedbackOpacity: 1
    currFocusRow: 0
    currFocusSection: -1
    drawFocusFeedback: true
    drawFocusFeedbackOnTop: false
    fadeFocusFeedbackWhenAutoScrolling: false
    fixedLayout: false
    focusBitmapBlendColor: -1
    focusBitmapUri: "pkg:/images/rokubutton300x35.9.png"
    focusColumn: <Component: roArray>
    focusFootprintBitmapUri: ""
    focusFootprintBlendColor: -1
    focusRow: <Component: roArray>
    horizFocusAnimationStyle: "floatingfocus"
    horizFocusDirection: "none"
    itemClippingRect: <Component: roAssociativeArray>
    itemFocused: 0
    itemSelected: -1
    itemSize: <Component: roArray>
    itemSpacing: <Component: roArray>
    itemUnfocused: -1
    jumpToItem: 0
    numColumns: 1
    numRenderPasses: 3
    numRows: 7
    rowHeights: <Component: roArray>
    rowSpacings: <Component: roArray>
    scrollingStatus: false
    scrollSpeed: 5
    sectionDividerBitmapUri: ""
    sectionDividerFont: <Component: roSGNode:Font>
    sectionDividerHeight: 60
    sectionDividerLeftOffset: 0
    sectionDividerMinWidth: 175
    sectionDividerSpacing: 15
    sectionDividerTextColor: -572662273
    sectionDividerTopOffset: 0
    sectionDividerWidth: 0
    vertFocusAnimationStyle: "floatingfocus"
    vertFocusDirection: "none"
    wrapDividerBitmapUri: ""
    wrapDividerHeight: 36
    wrapDividerLeftOffset: 0
    wrapDividerWidth: 0
    childRenderOrder: "last"
    clippingRect: <Component: roAssociativeArray>
    enableRenderTracking: true
    inheritParentOpacity: true
    inheritParentTransform: true
    muteAudioGuide: false
    opacity: 1
    renderPass: 0
    renderTracking: "full"
    rotation: 0
    scale: <Component: roArray>
    scaleRotateCenter: <Component: roArray>
    translation: <Component: roArray>
    visible: true
    change: <Component: roAssociativeArray>
    focusable: true
    focusedChild: <Component: roSGNode:LabelList>
    id: "UserButtons"

Any help on where I'm amiss here would be greatly appreciated.

Who is online

Users browsing this forum: No registered users and 12 guests