Есть ли лучшая альтернатива sap.ui.commons.layout.MatrixLayout?

Question

Каков наилучший способ создания макета, где фиксируется исходный контент, центр гибкий и конечный контент фиксирован? Как HBox на 100% с тремя колонками, первый и последний столбцы фиксированы, а центр растягивается?

Вот как я это делаю сейчас, могу ли я избежать использования sap.ui.commons.layout.MatrixLayout?

new sap.ui.commons.layout.MatrixLayout({ 
    layoutFixed: true, 
    columns: 3, 
    width: '100%', 
    widths: [ '100px', '100%', '100px' ], 
    rows: [ 
     new sap.ui.commons.layout.MatrixLayoutRow({ 
      cells : [ 
       new sap.ui.commons.layout.MatrixLayoutCell({ 
        content: new sap.m.Label({ 
         text: 'start' 
        }) 
       }), 
       new sap.ui.commons.layout.MatrixLayoutCell({ 
        content: new sap.m.Label({ 
         text: 'center' 
        }) 
       }), 
       new sap.ui.commons.layout.MatrixLayoutCell({ 
        content: new sap.m.Label({ 
         text: 'end' 
        }) 
       }) 
      ] 
     }) 
    ] 
}) 

Я пытался использовать sap.ui.layout.HorizontalLayout, но она не растягивается по горизонтали:

sap.ui.layout.HorizontalLayout({ 
    width: '100%', 
    content: [ 
     new sap.m.Label({ 
      width: '100px', 
      text: 'start' 
     }), 
     new sap.m.Label({ 
      width: '100%', 
      text: 'center' 
     }), 
     new sap.m.Label({ 
      width: '100px', 
      text: 'end' 
     }) 
    ] 
}) 

Answer 1

Хорошо, я думаю, что я получил его. :)

new sap.m.HBox({ 
    items: [ 
     new sap.m.Label({ 
      text: 'start', 
      width: '100px', 
      layoutData: new sap.m.FlexItemData({ 
       growFactor: 0 
      }) 
     }), 
     new sap.m.Label({ 
      text: 'center', 
      layoutData: new sap.m.FlexItemData({ 
       growFactor: 1 
      }) 
     }), 
     new sap.m.Label({ 
      text: 'end', 
      width: '100px', 
      layoutData: new sap.m.FlexItemData({ 
       growFactor: 0 
      }) 
     }) 
    ] 
}) 

Answer 2

HBox - это решение для браузеров, поддерживающих CSS3 FlexBoxLayout. В качестве альтернативы вы можете вложить два макета FixFlex - это должно работать во всех браузерах, поддерживающих UI5 (FixFlex похож на конкретный ограниченный подмножество HBox/Vbox с резервным доступом для браузеров без FlexBox).