Sproutcore - появление Webkit в поле поиска - PullRequest
0 голосов
/ 07 июня 2011

Я пытаюсь создать поле поиска с внешним видом Webkit. Но я обхожу это. Вот как я создаю searchField

mySearchView: SC.TextFieldView.design({
    layerId: 'searchView',
    layout: {height: 20, width: 120, centerY: 0, right: 240},
    hint: 'Search',
    classNames: ['searchField']
}),

и здесь часть css

.searchField { 
    background: none !important; 
    outline: none !important; 
    -webkit-appearance: searchfield !important; 
} 

.searchField input[type="search"] {
    -webkit-appearance: searchfield !important;
    -webkit-box-sizing: border-box !important;
}

.searchField input[type="search"]::-webkit-search-cancel-button 
{ 
   -webkit-appearance: searchfield-cancel-button !important; 
} 

.searchField input[type="search"]::-webkit-search-decoration { 
   -webkit-appearance: searchfield-decoration !important; 
} 

.searchField input[type="search"]::-webkit-search-results-decoration { 
   -webkit-appearance: searchfield-results-decoration !important; 
} 

.searchField input[type="search"]::-webkit-search-results-button 
{ 
   -webkit-appearance: searchfield-results-button !important; 
}

Но это не работает. Лучшее, что я мог получить, - это округленное поле ввода и одно квадратное перекрытие. Я даже не вижу, появляются ли кнопки лупы и отмены или нет. Кто-нибудь получал такую ​​точку зрения? что не так с моим кодом?

1 Ответ

0 голосов
/ 11 августа 2011

Извините, что сообщаю вам такие плохие новости, но с SC до 1.6 он никогда не будет работать (по крайней мере, со стандартным SC.TextFieldView). Если вы посмотрите на код source для SC.TextFieldView между строками 580 и 590, вы увидите, что он всегда отображается как текстовое поле. Для отображения в качестве поля поиска тип ввода должен быть поиском. Единственный вариант - предоставить настроенный метод рендеринга, но это, к сожалению, означает дублирование большого количества строк кода.

...