Google Android - это несложно

Добро пожаловать на форум сайта startandroid.ru
Текущее время: 17 июн 2019, 07:47

Часовой пояс: UTC + 3 часа




Начать новую тему Ответить на тему  [ Сообщений: 22 ]  На страницу 1, 2  След.
Автор Сообщение
 Заголовок сообщения: Пример использования стилей
СообщениеДобавлено: 15 май 2012, 23:21 

Зарегистрирован: 07 май 2012, 00:32
Сообщений: 22
Благодарил (а): 0 раз.
Поблагодарили: 5 раз.
Сегодня решил в целях обучения написать свое приложение для работы с базой данных на примере уроков 34 и 35. Основное внимение я уделю примененным стилям.

Во время написания оболочки программы стало очевидно, что очень многие элементы описания повторяются, и зачастую, я создаю абсолютно одинаковые элементы многократно повторяя их стиль. Стало интересно, можно ли создать отдельный файл со стилями для оболочки, как используются CSS для стилизации HTML страниц. Как оказалось - можно, и даже нужно. Подробнее об этом можно почитать здесь и здесь.

Вот файл оболочки программы - main.xml:

Код: [ Загрузить ] [ Скрыть ]
Using XML Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2.  
  3. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  4.    android:layout_width="fill_parent"
  5.    android:layout_height="fill_parent"
  6.    android:orientation="vertical"
  7.    android:background="@drawable/bg">
  8.        
  9.        
  10.         <LinearLayout style="@style/main_LL_rows">
  11.             <TextView
  12.                     style="@style/labels"
  13.                     android:text="@string/ID"/>
  14.            
  15.             <EditText
  16.                 style="@style/EditText_Number"
  17.                 android:layout_width="60dp"
  18.                 android:id="@+id/etID"/>
  19.            
  20.             <Button style="@style/btn_120dp"
  21.                 android:text="@string/Edit"
  22.                 android:id="@+id/btnEdit"/>
  23.             <Button style="@style/btn_120dp"
  24.                 android:text="@string/Delete"
  25.                 android:id="@+id/btnDelete"/>
  26.         </LinearLayout>
  27.        
  28.        
  29.         <LinearLayout style="@style/main_LL_rows">
  30.             <TextView
  31.                     style="@style/labels"
  32.                     android:text="@string/Name"/>
  33.             <EditText
  34.                 style="@style/EditText_Text"
  35.                 android:layout_width="match_parent"
  36.                 android:id="@+id/etName"/>
  37.         </LinearLayout>
  38.        
  39.        
  40.         <LinearLayout style="@style/main_LL_rows">
  41.             <TextView
  42.                     style="@style/labels"
  43.                     android:text="@string/Age"/>
  44.             <EditText
  45.                 style="@style/EditText_Number"
  46.                 android:layout_width="60dp"
  47.                 android:id="@+id/etAge"/>
  48.         </LinearLayout>
  49.  
  50.        
  51.         <LinearLayout style="@style/main_LL_rows">
  52.                 <TextView
  53.                     style="@style/labels"
  54.                     android:text="@string/Sex"/>
  55.                 <RadioGroup
  56.                     android:layout_width="match_parent"
  57.                     android:layout_height="wrap_content"
  58.                     android:orientation="horizontal"
  59.                     android:id="@+id/rgSex">
  60.                     <RadioButton style="@style/Text"
  61.                         android:text="@string/Male"
  62.                         android:id="@+id/rbMale"
  63.                         android:checked="true"
  64.                         android:layout_marginLeft="15dp"/>
  65.                     <RadioButton style="@style/Text"
  66.                         android:text="@string/Female"
  67.                         android:id="@+id/rbFemale"
  68.                         android:layout_marginLeft="15dp"/>
  69.                 </RadioGroup>
  70.         </LinearLayout>
  71.        
  72.        
  73.         <LinearLayout style="@style/main_LL_rows">
  74.                 <Button style="@style/Button"
  75.                 android:text="@string/Add"
  76.                 android:id="@+id/btnAdd"
  77.                 android:layout_weight="1"/>
  78.             <Button style="@style/Button"
  79.                 android:text="@string/View"
  80.                 android:id="@+id/btnView"
  81.                 android:layout_weight="1"/>
  82.             <Button style="@style/Button"
  83.                 android:text="@string/Clear"
  84.                 android:id="@+id/btnClear"
  85.                 android:layout_weight="1"/>
  86.         </LinearLayout>
  87.  
  88. </LinearLayout>
  89.  


Сами стили хранятся в файле styles.xml в директории values:
Код: [ Загрузить ] [ Скрыть ]
Using XML Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <resources>
  3.         <!-- ************************************************************ -->
  4.         <!-- Основные классы стилей -->
  5.        
  6.         <style name="Text">
  7.                 <item name="android:textColor">#404040</item>
  8.         </style>
  9.        
  10.         <style name="Button">
  11.                 <item name="android:layout_width">wrap_content</item>
  12.                 <item name="android:layout_height">wrap_content</item>
  13.         </style>
  14.        
  15.         <style name="EditText">
  16.                 <item name="android:layout_width">wrap_content</item>
  17.                 <item name="android:layout_height">wrap_content</item>
  18.         </style>
  19.        
  20.        
  21.         <!-- ************************************************************ -->
  22.  
  23.  
  24.         <style name="EditText_Number" parent="EditText">
  25.                 <item name="android:inputType">number</item>
  26.         </style>
  27.        
  28.         <style name="EditText_Text" parent="EditText">
  29.                 <item name="android:inputType">text</item>
  30.         </style>
  31.        
  32.         <!-- ************************************************************ -->
  33.        
  34.        
  35.         <style name="main_LL_rows">
  36.                 <item name="android:layout_width">match_parent</item>
  37.                 <item name="android:layout_height">wrap_content</item>
  38.                 <item name="android:orientation">horizontal</item>
  39.                 <item name="android:gravity">center_vertical</item>
  40.                 <item name="android:layout_marginTop">15dp</item>
  41.         </style>
  42.        
  43.         <style name="labels" parent="@style/Text">
  44.                 <item name="android:textSize">20dp</item>
  45.                 <item name="android:layout_width">60dp</item>
  46.                 <item name="android:layout_height">wrap_content</item>
  47.                 <item name="android:gravity">center</item>
  48.     </style>
  49.  
  50.    
  51.     <style name="btn_120dp" parent="@style/Button">
  52.         <item name="android:layout_width">95dp</item>
  53.     </style>
  54.    
  55. </resources>
  56.  


Теперь давайте разберемся, что же происходит в этих стилях.

Сначала я создал несколько основных классов стилей, свойства которых будут наследоваться остальными классами. По умолчанию я установил ширину и высоту для кнопок(Button) и полей ввода(EditText) равными wrap_content. Это совсем не значит, что это значение будет постоянно для всех элементов перечисленных типов, а лишь то, что если эти свойства не будут изменены, они останутся равными wrap_content. Всему тексту по умолчанию я установил цвет #404040.

Затем, так как у нас поля ввода будут двух типов - цифровые и текстовые, я создал два подкласса - EditText_Number и EditText_Text, которые наследуют свойства класса EditText (строка parent="EditText" означает, что класс this наследует свойство класса EditText). Теперь, если поле ввода будет иметь стиль класса EditText_Number, то этому элементу будут добавлены сразу 3 свойства:

Код: [ Загрузить ] [ Скрыть ]
Using XML Syntax Highlighting
  1. <item name="android:layout_width">wrap_content</item>
  2. <item name="android:layout_height">wrap_content</item>
  3. <item name="android:inputType">number</item>
  4.  


В коде main.xml можно увидеть, что весь интерфейс разбит на строки по LinearLayout'aм. Каждому такому LL(LinearLayout) я присвоил стиль, названный main_LL_rows. Теперь мне не приходится каждый раз прописывать эти 5 свойств каждому из LL:

Код: [ Загрузить ] [ Скрыть ]
Using XML Syntax Highlighting
  1. android:layout_width = "match_parent"
  2. android:layout_height = "wrap_content"
  3. android:orientation = "horizontal"
  4. android:gravity = "center_vertical"
  5. android:layout_marginTop = "15dp"
  6.  


Достаточно написать:

Код: [ Загрузить ] [ Скрыть ]
Using XML Syntax Highlighting
  1. <LinearLayout style="@style/main_LL_rows">
  2. ...
  3. </LinearLayout>
  4.  


и теперь к каждому LL будет применен стиль класса main_LL_rows, т.е. автоматически каждому LL прописываются эти 5 свойств.

Содержимое файла strings.xml:

Код: [ Загрузить ] [ Скрыть ]
Using XML Syntax Highlighting
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <resources>
  3.  
  4.     <string name="hello">Hello World, MainActivity!</string>
  5.     <string name="app_name">UsingDatabase2</string>
  6.     <string name="Name">Name</string>
  7.     <string name="ID">ID</string>
  8.    
  9.     <string name="Sex">Sex</string>
  10.     <string name="Male">Male</string>
  11.     <string name="Female">Female</string>
  12.     <string name="Age">Age</string>
  13.    
  14.    
  15.     <string name="Edit">Edit</string>
  16.     <string name="Delete">Delete</string>
  17.     <string name="Add">Add</string>
  18.     <string name="View">View</string>
  19.     <string name="Clear">Clear</string>
  20.  
  21. </resources>
  22.  


А вот сам результат:

Изображение


Последний раз редактировалось icamys 16 май 2012, 18:49, всего редактировалось 2 раз(а).

Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 16 май 2012, 09:44 
Администратор
Аватар пользователя

Зарегистрирован: 07 янв 2012, 11:32
Сообщений: 1400
Благодарил (а): 0 раз.
Поблагодарили: 75 раз.
Отлично! Только непонятно, зачем здесь весь БД-шный код. На мой взгляд, тут вообще java код не нужен, т.к. работаем только с layout-ами и основная цель - объяснить применение стилей. Но материал ваш и решать вам, разумеется.

Вообще надо мне подумать над тем, чтобы параллельно со своими уроками публиковать материалы желающих. Этот материал вполне тянет на полноценный урок.

_________________
Добро пожаловать на форум сайта StartAndroid
ИзображениеИзображение


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 16 май 2012, 13:34 

Зарегистрирован: 07 май 2012, 00:32
Сообщений: 22
Благодарил (а): 0 раз.
Поблагодарили: 5 раз.
Пожалуй, Вы правы насчет БД-шного кода. Если не сегодня, то на днях уберу.


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 16 май 2012, 18:50 

Зарегистрирован: 07 май 2012, 00:32
Сообщений: 22
Благодарил (а): 0 раз.
Поблагодарили: 5 раз.
Все, подправил, и еще кое-что добавил =)


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 17 май 2012, 14:04 
Администратор
Аватар пользователя

Зарегистрирован: 07 янв 2012, 11:32
Сообщений: 1400
Благодарил (а): 0 раз.
Поблагодарили: 75 раз.
icamys писал(а):
Все, подправил, и еще кое-что добавил =)


Гут, спасибо! Я написал об этом на главной.
http://startandroid.ru/novosti/o-sajte/155-styles-ispolzovanie-stilej.html

_________________
Добро пожаловать на форум сайта StartAndroid
ИзображениеИзображение


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 09 июн 2012, 10:08 

Зарегистрирован: 07 июн 2012, 22:52
Сообщений: 1
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.
странно, когда я добавляю в стили
<item name="android:orientation">vertical</item>
она не отрабатывает, только если я непосредственно добавлю ее в main.xml


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 13 июн 2012, 09:34 
Администратор
Аватар пользователя

Зарегистрирован: 07 янв 2012, 11:32
Сообщений: 1400
Благодарил (а): 0 раз.
Поблагодарили: 75 раз.
2k7demon писал(а):
странно, когда я добавляю в стили
<item name="android:orientation">vertical</item>
она не отрабатывает, только если я непосредственно добавлю ее в main.xml

У меня почему-то с корневым Layout-ом не работает. А с детишками его все ок.

_________________
Добро пожаловать на форум сайта StartAndroid
ИзображениеИзображение


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Программное применение стилей
СообщениеДобавлено: 09 янв 2013, 03:12 

Зарегистрирован: 08 янв 2013, 22:54
Сообщений: 4
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.
А как можно программно применить стиль? К динамически создаваемым View?


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Программное применение стилей
СообщениеДобавлено: 09 янв 2013, 09:05 
Аватар пользователя

Зарегистрирован: 26 июн 2012, 13:22
Сообщений: 3422
Откуда: UA
Благодарил (а): 11 раз.
Поблагодарили: 244 раз.
kogrenich писал(а):
А как можно программно применить стиль? К динамически создаваемым View?

public View (Context context, AttributeSet attrs, int defStyle)

_________________
R.id.team
Политика на форуме запрещена


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Программное применение стилей
СообщениеДобавлено: 10 янв 2013, 00:07 

Зарегистрирован: 08 янв 2013, 22:54
Сообщений: 4
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.
rezak90 писал(а):
kogrenich писал(а):
А как можно программно применить стиль? К динамически создаваемым View?

public View (Context context, AttributeSet attrs, int defStyle)


Спасибо за подсказку. Почему-то не применяется. Не подскажете в чем может быть причина?

Код: [ Загрузить ] [ Скрыть ]
Using XML Syntax Highlighting
  1. <?xml version="1.0" encoding="UTF-8"?>
  2. <resources>
  3.         <!-- ************************************************************ -->
  4.         <!-- Форматирование таблиц -->
  5.         <!-- Строки:Основная -->
  6.         <style name="TableRow">
  7.                 <item name="android:textColor">#132721</item>
  8.                 <item name="android:textSize">12dp</item>
  9.                 <item name="android:typeface">serif</item>
  10.                 <item name="android:textStyle">normal</item>
  11.                 <item name="android:background">#F7EB9D</item>
  12.         </style>
  13.         <!-- Строки:Альтернативная -->
  14.         <style name="TableRow.Alt">
  15.                 <item name="android:background">#B5F8E4</item>
  16.         </style>
  17.         <!-- Строки:Заголовок -->
  18.         <style name="TableRow.Top">
  19.                 <item name="android:textColor">#F5F5DC</item>
  20.                 <item name="android:gravity">center_horizontal</item>
  21.                 <item name="android:textSize">14dp</item>
  22.                 <item name="android:textStyle">bold</item>
  23.                 <item name="android:background">#b89300</item>
  24.         </style>
  25. </resources>
  26.  


Код: [ Загрузить ] [ Скрыть ]
  1. TextView tv = new TextView (context, null, Resource.Style.TableRow); 


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 10 янв 2013, 00:37 
Аватар пользователя

Зарегистрирован: 26 июн 2012, 13:22
Сообщений: 3422
Откуда: UA
Благодарил (а): 11 раз.
Поблагодарили: 244 раз.
паррента нужно указывать:
Код: [ Загрузить ] [ Скрыть ]
Using Java Syntax Highlighting
  1. <style name="MyTextViewStyle" parent="android:Widget.TextView">
  2. <item name="android:textColor">#F5F5DC</item>
  3. <item name="android:gravity">center_horizontal</item>
  4. <item name="android:textSize">14dp</item>
  5. <item name="android:textStyle">bold</item>
  6. <item name="android:background">#b89300</item>
  7. </style>

по идеи так должно работать

_________________
R.id.team
Политика на форуме запрещена


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 10 янв 2013, 17:59 

Зарегистрирован: 08 янв 2013, 22:54
Сообщений: 4
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.
Странное что-то. SetTextAppearance работает и задает параметры отображения текста. а вот указание в конструкторе бесполезно - не применяется ни background, ни настройки текста:

Код: [ Загрузить ] [ Скрыть ]
Using C Syntax Highlighting
  1. TextView tv = new TextView (context, null, Resource.Style.TableRow);
  2. tv.SetTextAppearance(context, Resource.Style.TableRow);


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 13 мар 2013, 13:24 

Зарегистрирован: 01 янв 2013, 15:52
Сообщений: 41
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.
Может кто знает, почему не отрабатывает атрибут стиля такой как layout_marginLeft
а также layout_marginRight ?

Т.е. допустим создаю стиль с этими атрибутами, и потом его назначаю TextView.
И эти атрибуты игнорятся. Почему?


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 13 мар 2013, 13:27 
Аватар пользователя

Зарегистрирован: 26 июн 2012, 13:22
Сообщений: 3422
Откуда: UA
Благодарил (а): 11 раз.
Поблагодарили: 244 раз.
а вы бросайте код и мы посмотрим, может не так стиль пишете

_________________
R.id.team
Политика на форуме запрещена


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 13 мар 2013, 18:57 

Зарегистрирован: 01 янв 2013, 15:52
Сообщений: 41
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.
Нашел в чем дело, название атрибута было написано не точно.


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 23 июл 2013, 08:00 

Зарегистрирован: 10 апр 2013, 07:56
Сообщений: 17
Благодарил (а): 4 раз.
Поблагодарили: 0 раз.
Здравствуйте! прошу не пинать)))
Не могу найти, как выровнять текст внутри textView?
типа как в HTML - text-align.


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 23 июл 2013, 08:45 

Зарегистрирован: 06 апр 2013, 14:01
Сообщений: 131
Благодарил (а): 4 раз.
Поблагодарили: 17 раз.
android:gravity


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 23 июл 2013, 08:51 

Зарегистрирован: 10 апр 2013, 07:56
Сообщений: 17
Благодарил (а): 4 раз.
Поблагодарили: 0 раз.
да, уже кое-как нашел. спасибо!!

ЗЫ вот так всегда. три дня будешь искать ответ на свой вопрос, и не найдешь. но стоит только задать его на форуме.... как сразу же гугл сдается.


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 14 июн 2014, 15:15 

Зарегистрирован: 15 май 2014, 15:10
Сообщений: 3
Благодарил (а): 0 раз.
Поблагодарили: 0 раз.
kogrenich писал(а):
Странное что-то. SetTextAppearance работает и задает параметры отображения текста. а вот указание в конструкторе бесполезно - не применяется ни background, ни настройки текста:

Код: [ Загрузить ] [ Скрыть ]
  1. TextView tv = new TextView (context, null, Resource.Style.TableRow); 
  2. tv.SetTextAppearance(context, Resource.Style.TableRow); 


Вопрос все еще актуален. Столкнулся с такой же проблемой. Как применить стили к динамически создаваемым элементам? Через конструктор не получается.
Может побьете за ссылку, но этот вопрос я уже задавал на киберфоруме. Там же и код. Ссылка на тему текстом:
http://www.cyberforum.ru/android-dev/thread1207474.html

Есть варианты?


Вернуться наверх
 Профиль  
 
 Заголовок сообщения: Re: Пример использования стилей
СообщениеДобавлено: 14 июн 2014, 17:12 

Зарегистрирован: 30 апр 2014, 11:42
Сообщений: 180
Благодарил (а): 3 раз.
Поблагодарили: 44 раз.
Ну так, если вы расширяете TextView, то вполне логичным было бы также унаследовать и стиль из итого же виджета, переопределив только некоторые аттрибуты, собственно в этой теме есть ответ viewtopic.php?f=25&t=912&view=unread&sid=5d7ca8cfd775ba52e7c603580097f7ec#p8184


Вернуться наверх
 Профиль  
 
Показать сообщения за:  Сортировать по:  
Начать новую тему Ответить на тему  [ Сообщений: 22 ]  На страницу 1, 2  След.

Часовой пояс: UTC + 3 часа


Вы не можете начинать темы
Вы не можете отвечать на сообщения
Вы не можете редактировать свои сообщения
Вы не можете удалять свои сообщения
Вы не можете добавлять вложения

Найти:
Powered by phpBB® Forum Software © phpBB Group
Русская поддержка phpBB