Создание левой панели Android, как в приложении «ТВ и фильмы» в Google TV. - PullRequest
2 голосов
/ 14 января 2012

У меня есть ситуация, когда мне нужно создать левую панель.Мой менеджер говорит, что это должно быть похоже на то, которое используется в приложении TV & Movies на устройстве Google TV, которое первоначально показывает только значки и расширяется по содержанию вправо, чтобы отображать текст значка также, когда он получаетfocus.

Я хочу, чтобы вкладки были такими, как на следующем рисунке (белые прямоугольники - это мои ссылки, а красный прямоугольник - моя левая панель):

Required Left Panel Structure

Увеличенное изображение можно посмотреть здесь

Мои требования к левой панели:

  1. Он должен расширяться по правой части, когда любойего ссылка сфокусирована.Мне кажется, анимация по ширине не должна быть сложной.Но как я узнаю, что элемент управления находится на левой панели, получил / потерял фокус
  2. Отдельное действие загружается в FrameLayout с правой стороны, когда на левой панели нажимается какая-либо ссылка ... Я также сделал этотоже используя обходной путь.Но я предпочел бы знать какой-нибудь неплохой подход.
  3. Левая панель должна уменьшаться в ширине и должна скрывать текст иконки, когда пользователь фокусирует загруженную активность, нажимая кнопку RIGHT D-PAD.

  4. Я должен иметь возможность свободно перемещаться, используя КЛАВИАТУРА между левой панелью и дочерними элементами управления активностью, которые загружены в контейнер FrameLayout.Это потому, что мое приложение предназначено для Google TV, где пользователи предпочитают навигацию, используя D-Pad . это основная проблема, с которой я сталкиваюсь ... поскольку я не могу перейти от дочернего элемента управления к элементу управления соседа его родителя

Чтобы все вышеперечисленноеТочки, я посмотрел на TabHost, но не смог найти способ сделать его похожим на тот, который мне нужен.

Я также видел themissingtabwidget , но его вертикальные вкладки заполняют все вертикально доступное пространствои там размещение не контролируется для меня, мне нужно больше как левая панель, как структура, где я могу разместить ссылки в любом месте, где я захочу.Так что это тоже не удалось.

Теперь я решил создать его сам.Я делаю это следующим образом:

  1. main.xml содержит FrameLayout в корне, который содержит
    • FrameLayout для удержания активности - я установил его поле слева так, чтобы следующая левая панель помещалась в это пространство и когда охватывала рамку вместо того, чтобы идти под ней, когда я анимирую размер панели
    • RelativeLayout для удержания элементов левой панели.

Main.xml выглядит следующим образом:

<?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">

<!-- 
    THIS First TabHost IS NOT USED AT ALL.
    I JUST PUT IT HERE AS THE underlying TabActivity required it and was giving me error.
    You can see its visibility is set to GONE.

    You can just minimize it and forget it as its a silly Workaround.
    and help me if you know of some better way
 -->
<TabHost
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:visibility="gone" >

    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="horizontal" >

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="100dp"
            android:layout_height="fill_parent"
            android:layout_weight="0"
            android:orientation="vertical" />

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1" />
    </LinearLayout>
</TabHost>

<!-- 
    Activities are loaded here in this frame.
    Its margin from Left is set to 150dp to have space.
    Its placed on the first place as the second RelativeLayout would be used as Left Panel.
-->
<FrameLayout
    android:id="@+id/container"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:layout_marginLeft="150dp"
    android:nextFocusLeft="@+id/leftpanel"
    android:background="#CCAAAA" >
</FrameLayout>

<!--
    Left Panel holding links/buttons etc to load a separate activity in above FrameLayout 
 -->
<RelativeLayout
    android:id="@+id/leftpanel"
    android:layout_width="200dp"        
    android:layout_height="fill_parent"
    android:background="#33FAFAFA"
    android:focusable="True"
    android:orientation="vertical" >

    <Button
        android:id="@+id/btnArtists"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Artists" >
    </Button>

    <Button
        android:id="@+id/btnAlbum"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btnArtists"
        android:text="Album" >
    </Button>

    <Button
        android:id="@+id/btnLogin"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="True"
        android:text="Login" >
    </Button>
</RelativeLayout>

действие основной вкладки выглядит следующим образом:

public class TestActivity extends TabActivity {
FrameLayout container;
Intent artistsIntent;
Intent albumsIntent;

/** Called when the activity is first created. */
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    container = (FrameLayout)findViewById(R.id.container);
    artistsIntent = new Intent().setClass(this, ArtistsActivity.class);
    albumsIntent = new Intent().setClass(this, AlbumsActivity.class);

    Button btnArtist = (Button)findViewById(R.id.btnArtists);        
    btnArtist.setOnClickListener(new OnClickListener() {

        public void onClick(View v) {
            container.removeAllViews();
            View view = getLocalActivityManager().startActivity("ArtistsActivity",
                    new Intent(getApplicationContext(), ArtistsActivity.class).addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP)).getDecorView();
            container.addView(view);                
        }
    });

    Button btnlbum = (Button)findViewById(R.id.btnAlbum);
    btnlbum.setOnClickListener(new OnClickListener() {

        public void onClick(View v) {
            container.removeAllViews();   
            View view = getLocalActivityManager().startActivity("AlbumsActivity",
                    new Intent(getApplicationContext(), AlbumsActivity.class).addFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP)).getDecorView();
            container.addView(view);

        }
    });
}    
}

Как вы можете видеть, основной TestActivity является TabActivity , который предоставляет функциональные возможности для реализациивкладки.Я расширил свою активность с TabActivity , потому что, насколько мне известно, это был единственный способ добавить действие в FrameLayout в качестве дочернего представления.

Это также заставило меня иметь TabHost с этим конкретным именем.поэтому я добавил его и установил его видимость на ушел , чтобы перестать жаловаться.... ДА, Я ЗНАЮ ... ЭТО ГЛУБОКАЯ РАБОТА .. НО меня бы здесь не было, если бы я знал какой-то правильный путь ... так что помогите мне, если есть какой-то лучший способ сделать это.

Другая проблема с моим текущим тестовым проектом заключается в том, что когда я фокусирую кнопку в дочернем действии, которое загружается в FrameLayout с помощью клавиши со стрелкой вправо ... Я не могу сфокусироваться на кнопкахв левой панели, используя ВЛЕВО клавиатуру ...

КАК ЭТО СДЕЛАТЬ ????????????

Я загрузилнебольшой пример проекта здесь .Пожалуйста, загрузите его и посмотрите.Также установите тему .TestActivity на android: theme = "@ android: style / Theme.Holo" в AndroidManifest.xml, чтобы приложение отображалось в полноэкранном режиме, как и предполагалось.

Ваша помощь очень ценится.

ПРИМЕЧАНИЕ: я создаю это приложение для Google TV ... где навигация в основном зависит от D-Pad ... поэтому я должен убедиться, что могу добраться куда угодно с помощью Kayboard.

Так помогите мне.

Ответы [ 2 ]

2 голосов
/ 16 января 2012

Если я не ошибаюсь, вы ищете Библиотеку левой навигационной панели , предоставленную Google только для этой цели.

Также см. Предоставленный пример кода дляиспользуя его .

1 голос
/ 14 января 2012

Фрагменты Android идеально подойдут для ваших целей. Взгляните на документацию , которая действительно понятна и объясняет, как правильно ее использовать.

...