Sencha Touch 2 : 3 용기 : 왼쪽으로 고정 (고정 너비) + 오른쪽으로 고정 (고정 너비) + 중간 (나머지)

Question

세 개의 컨테이너를 왼쪽의 3em 너비의 수평으로 정렬하는 가장 좋은 방법은 무엇입니까? 컨테이너와 3em 오른쪽 컨테이너에 대한 나머지 너비 중간 하나?

layout:{ 
    type : 'hbox', 
    pack : 'center' 
}, 

items:[ 
{/*3em*/ 
xtype:'container', 
cls:'left', 
html:'left text', 
}, 
{ 
xtype:'container', 
cls:'middle', 
html:'middle text', 
}, 
{/*3em*/ 
xtype:'container', 
cls:'right', 
html:'right text', 
}, 
] 

내가 더 잘 순수 CSS를 float:left;, float:right; 및 overflow:hidden;를 사용하는 거라고 만약 내가 궁금하거나 이러한 목적으로 flex를 사용할 수 있습니까?

Answer 1

사이드 컨테이너 양쪽에 고정 너비를 설정했는데 센터 컨테이너에 flex: 1을 설정할 수 있습니다. 하지만 당신은 이미 거기에 보이는데, 나는 당신을 막고있는 것을 보지 못합니까?

편집 :

터치 (EXT4하지 않는) 컨테이너의 폭 옵션으로 '그들'을 받아, 그래서 정말 자식 항목의 위치에 대한 CSS를 피하기 (또는 렌더링 것이기 때문에, 전체 컨테이너를 떨어 것 그것은 무기력하다). 내가 가장 올바른 방법에 대해 부탁 해요

layout: { 
     type: 'hbox' 
     ,pack: 'center' 
    } 

    ,defaultType: 'container' 

    ,items: [{ 
     html: 'Left' 
     ,width: '3em' 
     ,style: 'background: pink;' // just to materialize the container 
    },{ 
     html: 'Center' 
     ,flex: 1 
    },{ 
     html: 'Right' 
     ,width: '3em' 
     ,style: 'background: pink;' 
    }]