Белая рамка вместе с прозрачностью в LinearLayout

Я хотел добавить линейный макет с прозрачным фоном, а также с белыми рамками. Проблема в том, что, насколько я гуглил, я могу добиться только одного из обоих.

Вот что я сделал:

  1. Сохранено следующее как border.xml в drawable

      <?xml version="1.0" encoding="utf-8"?>
  <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item> 
       <shape android:shape="rectangle">
       <solid android:color="#FFFFFF" /> 
  </shape>
  </item>   
     <item android:left="5dp" android:right="5dp" android:top="5dp" android:bottom="5dp" >  
     <shape android:shape="rectangle"> 
     </shape>
   </item>    
  </layer-list>

  2. мой существующий макет страницы

         <LinearLayout
        android:id="@+id/quiz"
        android:layout_width="150dp"
        android:layout_height="120dp"
        android:background="#66041414"          <-------- replaced it with android:background="@drawable/border"
        android:orientation="vertical"
        android:layout_marginLeft="5dp" >

         ......
       </LinearLayout>

Я получаю непрозрачный фон, когда граница была включена.

Я хотел, чтобы окончательный результат выглядел так:


Reference image

полностью застрял в этом. Просто хотел найти выход, чтобы добиться этого. Любые предложения будут весьма полезны.


android java border transparency android-drawable
person anurag    schedule 26.01.2013    source источник
comment
Здесь я ответил, способ использования xml поможет.   -  person RobinHood    schedule 26.01.2013
comment
@Anurag: Пожалуйста, посмотрите на обновление ответа ниже с доказательством.   -  person VendettaDroid    schedule 26.01.2013

Ответы (4)


arrow_upward
43
arrow_downward

Ваш рисунок для фона макета:

Вы можете изменить радиус формы угла, если хотите. Но обводка создаст границу, а сплошная часть — это фон, который мы делаем прозрачным.

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
       android:shape="rectangle">
  <corners
      android:radius="2dp"
      android:topRightRadius="0dp"
      android:bottomRightRadius="0dp"
      android:bottomLeftRadius="0dp" />
  <stroke
      android:width="1dp"
      android:color="@android:color/white" />
  <solid android:color="@android:color/transparent"/>
</shape>

и мой тестовый layout.xml

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


    <LinearLayout 
        android:id="@+id/ll2"
        android:layout_height="50dp"
        android:layout_width="50dp"
        android:background="@drawable/my_transparent_linear_layout"></LinearLayout>
</LinearLayout>

Это работает. Ниже приведено доказательство:

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

person Community    schedule 26.01.2013
comment
Действительно работает ... Я знаю, что моих слов недостаточно для помощи, но все же большое спасибо, приятель .... ты сделал мой день :) :) - person anurag; 26.01.2013
comment
Спасибо, чувак, работает как шарм - person TacoEater; 03.01.2015
comment
Как насчет только нижней границы? - person azurh; 30.08.2015

arrow_upward
2
arrow_downward

Для этого вы можете использовать два макета aligned один над другим, затем установить фон transparent для top view и установить белую рамку в качестве фона для bottom view. Вы можете сделать это внутри relative layouts.

person Ali Imran    schedule 26.01.2013
comment
Попробуйте решение @VendettaDroid. - person Ali Imran; 26.01.2013

arrow_upward
2
arrow_downward

Xml Drawable для фона:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<corners android:radius="30dp" />
<stroke android:width="5dp" android:color="#ffffffff"/>
<solid android:color="#66000000"/>
</shape>

Отрегулируйте радиус, ширину и прозрачность темного цвета (части #ff и #66) по своему усмотрению.

person S.D.    schedule 26.01.2013
comment
я могу установить только одно значение для android: background... это либо граница, либо прозрачность... Согласно вашему коду, я получаю границы, но не прозрачность. Надеюсь ты меня понял?? в любом случае спасибо за оптимизированный код для границ. - person anurag; 26.01.2013
comment
@anurag просто отредактируйте цвета, первые 2 цифры для прозрачности (от #00 до #ff). Я поместил цвет заливки по умолчанию как #66000000, который является полупрозрачным черным, и цвет границы по умолчанию как "#ffffffff", который является полностью непрозрачным белым. - person S.D.; 26.01.2013
comment
@анураг. Значение цвета #FFBBCCDD - FF -> уровень прозрачности (00 — максимально прозрачный), BB -> уровень красного (FF -> полностью красный), CC -> уровень зеленого, DD -> уровень синего. Если значение цвета имеет только 6 шестнадцатеричных символов, а не 8, как здесь, это означает, что прозрачность игнорируется (элемент непрозрачен). #FFCCBBDD равно #CCBBDD. В следующий раз хотя бы попробуйте ответить, потому что @ Singularity как бы сделал то, что вы просили на изображении. - person cosmincalistru; 26.01.2013

arrow_upward
2
arrow_downward

Действительно хорошее предложение @Ali Imran, проверьте ниже, надеюсь, что это поможет.

back.xml

<?xml version="1.0" encoding="UTF-8"?> 
    <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle"> 
         <stroke android:width="1dp" android:color="#dd7b7a"/>
         <corners android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" 
         android:topLeftRadius="10dp" android:topRightRadius="10dp"/> 
         <solid android:color="#dd7b7a"/>
     </shape>

main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    >
<LinearLayout 
     android:padding="4dip"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="@drawable/back"
    android:gravity="center_horizontal"
    >
<LinearLayout  
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
   android:background="@drawable/tile_mode" // your transparent image
    />
</LinearLayout>  
</LinearLayout>

также перейдите по ссылкам ниже, способ использования xml вам подойдет.

Растровое изображение с закругленными углами и обводкой

person RobinHood    schedule 26.01.2013
comment
Сэр, спасибо за помощь, это очень ценно... но я получил то, что мне было нужно от @VendettaDroid... - person anurag; 26.01.2013