Радио-кнопки Android с гибкой шириной - PullRequest
0 голосов
/ 08 января 2012

В настоящее время я пытаюсь реализовать пользовательский интерфейс на Android (3.1) с вкладками внизу.Я знаю, что есть несколько способов, так как я не смог найти тот, который подходит мне, я пытаюсь использовать переключатели.Идея состоит в том, что каждая вкладка является переключателем (в настоящее время нет текста).

Предполагается, что макет будет выглядеть следующим образом:

В верхней части экрана находится структура кадра, выступающая в качестве контейнера для будущих фрагментов.

Под этим контейнером расположена горизонтальная радиогруппа, каждая из которых работает как вкладка.Предполагается, что активная вкладка (переключатель) перекрывает другие вкладки в верхней части, поэтому ясно, какая вкладка активна.Чтобы переключатели работали как вкладки, я установил атрибут android: button в statelistdrawable.Statelistdrawable содержит два изображения для активного и неактивного состояния (к сожалению, я пока не могу публиковать изображения).Так как изображение активной вкладки больше (по ширине), чем изображение неактивной вкладки, моя идея заключалась в том, чтобы использовать метод takeToFront () в onClickListener так, чтобы активная вкладка (или переключатель) перекрывала вкладки слева иправо на это.

Мой файл макета выглядит так:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >

<!-- container for the fragments -->
<FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#ffffff"
        android:layout_weight="0" />


<!-- container for the tabs realized with radio buttons -->
<RadioGroup
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="bottom"
  android:orientation="horizontal"
  android:layout_weight="1" >

  <!-- tabs -->
  <RadioButton android:id="@+id/tab_1"
      android:state_checked="false"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:button="@drawable/tab_button"
      android:text="" />
  <RadioButton android:id="@+id/tab_2"
      android:state_checked="false"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:button="@drawable/tab_button"
      android:text="" />
  <RadioButton android:id="@+id/tab_3"
      android:state_checked="false"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:button="@drawable/tab_button"
      android:text="" />
  <RadioButton android:id="@+id/tab_4"
      android:state_checked="false"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:button="@drawable/tab_button"
      android:text="" />
  <RadioButton android:id="@+id/tab_5"
      android:state_checked="false"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:button="@drawable/tab_button"
      android:text="" />
</RadioGroup>
</LinearLayout>

, а xml-файл statelistdrawable выглядит так:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" 
android:constantSize="false">
<item
 android:state_checked="false"
 android:drawable="@drawable/tab_inactive" />
<item
 android:state_checked="true"
 android:drawable="@drawable/tab_active" />
</selector>

К сожалению, я столкнулся с двумя проблемами:

  1. Несмотря на то, что я установил layout_weight для framelayout на 0, а один из радиогруппы на 1 в пределах linearlayout, окружающего эти два, framelayout занимает весь экран.
  2. Когда я устанавливаю высотуОтладка кадра до 0 для отладки, вкладки отображаются.Однако они неравномерно распределены по ширине, но перекрывают друг друга и как бы сжимаются влево.Когда я устанавливаю ширину радиокнопок, равную ширине (в пикселях) изображения, используемого для неактивных вкладок, вкладки выравниваются равномерно.Однако, когда я нажимаю на одну из вкладок и изображение вкладки меняется на изображение для активных вкладок, кнопка не перекрывает кнопки вправо или влево, даже если для атрибута android: constantSize в statelistdrawable установлено значение false, но это сдвигает его вправо.

Кто-нибудь есть решения этих проблем, особенно с использованием относительных размеров?Это мой первый пост здесь, и я заранее прошу прощения, если мой вопрос был разработан или не достаточно elaborte.Поверьте мне, я пытался решить эти проблемы целую вечность (например, используя абсолютные измерения).Любая помощь будет высоко ценится!

1 Ответ

0 голосов
/ 10 марта 2014

1.) Используйте FrameLayout в качестве макета упаковки.Это поместит RadioGroup поверх дочернего FrameLayout.Удалите атрибуты layout_weight из дочернего FrameLayout и RadioGroup.

2.) Отцентрируйте RadioGroup и используйте для него wrap_content, а также кнопки (например, с некоторыми отступами), если у ваших рисоваемых объектов есть определенное зависимое устройство.ширина.Или используйте layout_weight 1 на всех кнопках.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >

<!-- container for the fragments -->
<FrameLayout
        android:id="@+id/fragment_container"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#ffffff" />


<!-- container for the tabs realized with radio buttons -->
<RadioGroup
  android:layout_width="fill_parent"
  android:layout_height="wrap_content"
  android:layout_gravity="bottom|center"
  android:orientation="horizontal" >

  <!-- tabs -->
  <RadioButton android:id="@+id/tab_1"
      android:state_checked="false"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_weight="1"
      android:button="@drawable/tab_button"
      android:text="" />
  <RadioButton android:id="@+id/tab_2"
      android:state_checked="false"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_weight="1"
      android:button="@drawable/tab_button"
      android:text="" />
</RadioGroup>

</FrameLayout>
...