본문 바로가기

button

[sencha touch] picker title button 수정하기 위와 같이 title의 Done버튼과 Cancel버튼을 한글로 수정해 보겠습니다. 이런것들을 수정하려면 datepicker가 뭘 상속받는지 extend 와 뭘 필요로 하는지 requires를 살펴봐야 합니다. 그럼 다음 파일로 이동해서 수정해 보겠습니다. touch -> src -> picker -> Picker.js Picker.js파일을 열고 applyDoneButton 메소드를 수정해 봅시다. applyDoneButton: function(config) { if (config) { if (Ext.isBoolean(config)) { config = {}; } if (typeof config == "string") { config = { text: config }; } Ext.applyIf(confi.. 더보기
[sencha touch] 다양한 색깔의 button 만들어보기 다양한 색깔의 버튼을 만드는 방법도 scss파일을 사용하여 만듭니다. 이 scss파일을 다루는 방법을 조금만 익히면 sench touch잡업하는데 많은 도움이 될 것입니다. 간단한 코드 몇줄로 전체 theme을 수정하고 설정할 수 있습니다. 이 부분은 다음에 알아보기로 하고 오늘은 다양한 색깔의 button을 만드는 방법을 알아보겠습니다. scss파일을 열고 아래와 같이 추가해 봅니다. 첫번째는 사용할 이름을 설정합니다. 여기서는 black이란 이름으로 설정했습니다. 두번째는 버튼의 color를 설정합니다. 세번째는 버튼의 효과를 설정합니다. 효과로는 bevel, glossy, matte, flat이 있습니다. bevel glossy matte flat 다음과 같이 추가한 후 scss파일을 컴파일 합니다.. 더보기
[sencha touch] image button 만들기 지난번에는 버튼에 여러가지 icon을 넣는 방법을 알아봤었습니다. 이번에는 버튼이미지를 가지고 버튼을 만들어 보겠습니다. 일단 버튼모양의 이미지가 필요합니다. 이미지는 평상시 버튼이미지와 버튼을 눌렀을때의 이미지 두장이 필요합니다. 이미지는 http://www.iconfinder.com/에서 button으로만 검색해도 쉽게 찾을 수 있습니다. 이미지를 센차프로젝트안에 복사합니다. 어디에 넣든 경로만 알고 참조해 오면 상관 없지만 필자는 resources -> images 폴더안에 복사해 넣었습니다. 그리고 위 사진에서 sass폴더안에 scss파일에 해당 버튼이미지를 등록시켜 사용하면 됩니다. 전에 icon이미지를 사용할때도 설명했지만 프로젝트를 생성한후 기본적으로 적용되는 scss는 app.scss입니다.. 더보기