Кнопка просмотра изображения в таблице

Я настроил TableLayout и добавил строку, включающую кнопку и ImageView. ImageView — это просто цветная точка. В прошлом я использовал этот стиль с RelativeLayout и располагал изображение кнопки ImageView выше. Новое приложение, над которым я работаю, использует TableLayout, но когда я пытаюсь настроить кнопку с помощью ImageView, оно не позволяет позиционировать. Эта опция недоступна для TableLayout?

<TableLayout
    android:id="@+id/TB1"
    android:layout_width="250dp"
    android:layout_height="match_parent"
    android:layout_weight="1" >

    <TableRow
        android:id="@+id/tableRow1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="1" >

        <Button
            android:id="@+id/Scene1"
            android:layout_width="100dp"
            android:layout_height="match_parent"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:layout_weight="1"
            android:background="@drawable/custom_scene_buttons"
            android:text="Scene 1"
            android:textColor="@drawable/white"
            android:textSize="20sp" />

        <ImageView
            android:id="@+id/colordot1"
            android:layout_width="21dp"
            android:layout_height="21dp"
            android:background="@drawable/circle" />
    </TableRow>

Это код для изменения цвета точки.

                Resources res = getResources();
        final Drawable drawable = res.getDrawable(R.drawable.circle);
        drawable.setColorFilter(Color.rgb(i, j, k), Mode.SRC_ATOP);
        ImageView img = (ImageView) findViewById(R.id.colordot1);
        img.setBackgroundDrawable(drawable);

Вот вариант линейной компоновки, который я пробовал

                <LinearLayout android:orientation="vertical" >

            <Button
                android:id="@+id/Scene1"
                android:layout_width="100dp"
                android:layout_height="match_parent"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="10dp"
                android:layout_weight="1"
                android:background="@drawable/custom_scene_buttons"
                android:drawableRight="@drawable/circle"
                android:text="Scene 1"
                android:textColor="@drawable/white"
                android:textSize="20sp" />

            <ImageView
                android:id="@+id/colordot1"
                android:layout_width="21dp"
                android:layout_height="21dp"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="10dp"
                android:background="@drawable/circle" />
        </LinearLayout>

введите здесь описание изображения


android android-layout
person Bobby    schedule 04.01.2014    source источник

Ответы (1)


arrow_upward
0
arrow_downward

РЕДАКТИРОВАТЬ: включая весь TableLayout. Я заставил это работать, используя drawableRight. Вы можете изменить круг программно, захватив кнопку и изменив ее рисование. Вот ссылка, описывающая это. Ниже приведен скриншот TableLayout, который я тестировал.

Макет таблицы

<TableLayout
    android:id="@+id/TB1"
    android:layout_width="250dp"
    android:layout_height="match_parent"
    android:layout_weight="1" >

<TableRow
    android:id="@+id/tableRow1" >

    <Button
        android:id="@+id/Scene1"
        android:layout_width="50dp"
        android:layout_height="100dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:layout_weight="1"
        android:background="@color/blue"
        android:drawableRight="@drawable/circle"
        android:text="Scene 1"
        android:textColor="@color/white"
        android:textSize="20sp" />

    <Button
        android:id="@+id/Scene2"
        android:layout_width="50dp"
        android:layout_height="100dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:layout_weight="1"
        android:background="@color/blue"
        android:drawableRight="@drawable/circle"
        android:text="Scene 2"
        android:textColor="@color/white"
        android:textSize="20sp" />

</TableRow>

<TableRow
    android:id="@+id/tableRow2" >

    <Button
        android:id="@+id/Scene3"
        android:layout_width="50dp"
        android:layout_height="100dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:layout_weight="1"
        android:background="@color/blue"
        android:drawableRight="@drawable/circle"
        android:text="Scene 3"
        android:textColor="@color/white"
        android:textSize="20sp" />

    <Button
        android:id="@+id/Scene4"
        android:layout_width="50dp"
        android:layout_height="100dp"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:layout_weight="1"
        android:background="@color/blue"
        android:drawableRight="@drawable/circle"
        android:text="Scene 4"
        android:textColor="@color/white"
        android:textSize="20sp" />

</TableRow>

</TableLayout>

Проблема заключается в том, что при использовании TableLayout каждый дочерний элемент TableRow является столбцом. Итак, ваша кнопка и ImageView принадлежат разным столбцам. У вас есть другие строки в этом TableLayout? Ширина столбца определяется представлением с наибольшей шириной в этом столбце. Итак, если у вас есть еще один TableRow и его второе дочернее представление имеет ширину 100dp, это повлияет на ширину вашего второго столбца, то есть вашего круга ImageView.

Почему бы вместо этого не использовать атрибут drawableRight. Измените кнопку следующим образом и удалите свой ImageView. Вы также можете изменить рисуемое дополнение.

<Button
        android:id="@+id/Scene1"
        android:layout_width="100dp"
        android:layout_height="match_parent"
        android:layout_marginLeft="10dp"
        android:layout_marginTop="10dp"
        android:layout_weight="1"
        android:background="@drawable/custom_scene_buttons"
        android:text="Scene 1"
        android:textColor="@drawable/white"
        android:drawableRight="@drawable/circle"
        android:textSize="20sp" />
person Mike Ortiz    schedule 04.01.2014
comment
Цветная точка не отображается после добавления android:drawableRight=@drawable/circle Я также опубликовал код, который использую для изменения цвета точки. У меня есть 10 из них на макете, могу ли я изменить рисунок? - person Bobby; 05.01.2014
comment
Странный. Я думаю, вы можете альтернативно обернуть Button и ImageView в LinearLayout. Затем этот LinearLayout будет единственным дочерним элементом и столбцом TableRow. - person Mike Ortiz; 05.01.2014
comment
Линейная компоновка не дала бы мне возможности поставить точку поверх кнопки только рядом с ней. Спасибо за предложение. - person Bobby; 05.01.2014
comment
Это не правда. Вы можете установить вертикальную ориентацию LinearLayout. Затем поместите круг перед кнопкой. - person Mike Ortiz; 05.01.2014
comment
Я разместил ваше предложение, но не вижу, как поставить точку сверху (внутри кнопки) или справа от текста. - person Bobby; 05.01.2014
comment
Можете ли вы опубликовать весь свой TableLayout и точно описать, как вы хотите, чтобы окончательный макет выглядел? Кроме того, не могли бы вы лучше описать, где вы хотите, чтобы круг был по отношению к кнопке? Сверху, снизу, внутри и т.д.? - person Mike Ortiz; 05.01.2014
comment
Я выложил снимок экрана. См. кнопку F1. Точка была фотошопом. - person Bobby; 05.01.2014
comment
Я не мог заставить право выкупа работать. Я могу использовать изображение, и оно отображается на кнопке, но я не могу заставить его работать с помощью формы. Мне нужно использовать изображение, которым я могу управлять цветом RGB. - person Bobby; 13.01.2014