Sencha Touch : 동적 단추 배경

우리는 일련의 단추를 표시하기 위해 DataView를 사용하고 있습니다. 데이터는 상점에서 가져오고 여기에있는 각 모델에는 단추의 배경색이 들어 있습니다. 버튼의 텍스트를 변경할 수는 있지만 모델의 값을 기반으로 배경색을 변경하려면 어떻게해야합니까?Sencha Touch : 동적 단추 배경

이것은 ButtonData 모델입니다 :이 예제를 바탕으로

Ext.define('Sencha.model.ButtonData', { 
extend: 'Ext.data.Model', 

config: { 
    fields: [ 
     {name: 'text', type: 'auto'}, 
     {name: 'color', type: 'auto'} 
      ] 
     } 
});

http://www.sencha.com/blog/dive-into-dataview-with-sencha-touch-2-beta-2 나는이 설정과 함께있는 DataItem이 있습니다

config : { 
     dataMap: { 
      getButton : { setText: 'text'}, // works! 

//problem is here: how do I set the background color based on the 'color' 
// member form the 'ButtonData' model? 
       }, 

    button: { 
     ui: 'plain' 
     }

}

그래서 문제가 어떻게 설정하는 방법을 'color'멤버를 기반으로하는 배경색은 'ButtonData'모델을 형성합니까?

들으,

마틴

출처

2012-06-19 Maarten

시도 뭔가처럼 등 당신이 필요로하지 않는 부품을 보유하고 있습니다. 당신은 또한 그곳에서 하나의 기능을 가지고 모든 작업을 수행 할 수 있습니다.

출처

2012-06-21 08:13:55

결국 우리는 비슷한 접근법을 사용했습니다. 즉, Button에서 클래스를 파생시키고 setColor 함수를 추가하여 색상을 변경했습니다. 대답은 Thx입니다. – Maarten

당신이 버튼 위젯에없는 색 속성 버튼의 색상, 채도 darking, 그라디언트 ... 그래서 당신은 간단하게 변경할 수 없습니다 포함하여 작성된 효과가 있기 때문에 색상은 한 곳에서만 나타납니다.

권장 옵션은 표준 테마에서 시작하여 자신 만의 테마를 만든 다음 버튼에 대해 다른 테마 UI를 만드는 것입니다. 이 테마에이 같은 추가 라인을 수행 할 수 있습니다

// you can add as many as you want. 
@include sencha-button-ui('color1', #FF0000, 'glossy'); 
@include sencha-button-ui('color2', #00FF00, 'glossy');

는 엽차 터치 테마의 테마/스타일/센차 터치/기본/위젯/_buttons.scss 파일에 더 많은 옵션을 참조하십시오.

그러면 모델에 따라 버튼의 UI 속성을 변경할 수 있습니다. 자신의 테마로 작품의

http://www.sencha.com/blog/getting-sassy-with-css

다른 장점을 즉, CSS를 더 쉽게 터치입니다 당신은 제거 CSS 파일의 크기를 최적화 할 수 있습니다 :이 링크는 자신의 테마 및 실행을 얻을 도움이 될 수

config : { 
    dataMap: { 
     getButton : { 
     setText: 'text', 
     setButton: {} 
     } 
    } 
}

는 그 다음 DataView를에 사용되는 구성 요소의 setButton 기능을 구현

출처

2012-06-20 15:19:59 Israel

Sencha Touch : 동적 단추 배경

답변

관련 문제