Android: czy przeglądasz zaokrąglone rogi w przeglądarce?

Question

Próbuję nadać moim webView zaokrąglone rogi.

Oto mój kod:

rounded_webview.xml:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle" android:padding="10dp"> 
<solid android:color="#000"/> 
    <corners 
    android:bottomRightRadius="15dp" 
    android:bottomLeftRadius="15dp" 
    android:topLeftRadius="15dp" 
    android:topRightRadius="15dp"/> 
</shape> 

I tu jest moja Webview:

<WebView 
     android:id="@+id/webView1" 
     android:layout_width="293dp" 
     android:layout_height="142dp" 
     android:layout_gravity="center_horizontal" 
     android:padding="5dip" 
     android:background="@drawable/rounded_webview"/> 

Ale to po prostu nie będzie działać! Rogi nie są zaokrąglone ...

Wielkie dzięki z góry,

Answer 1

Jedynym sposobem jest owinąć elementu Webview innego widoku (FrameLayout na przykład), a zastosowanie zaokrąglone narożniki tła na widoku zewnętrznym . przykład:

<FrameLayout 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:paddingTop="10dip" 
     android:paddingBottom="10dip" 
     android:paddingLeft="1dip" 
     android:paddingRight="1dip" 
     android:background="@drawable/white_rounded_area" 
     > 
    <WebView 
      android:id="@+id/web_view" 
      android:layout_width="300dip" 
      android:layout_height="400dip" 
      android:layout_gravity="center" 
      /> 
</FrameLayout> 

przypadku paddingTop i paddingBottom równy zasięg z odkształcalne/white_rounded_area, paddingLeft i paddingRight równa szerokości skoku odkształcalne/white_rounded_area.

Minus tego podejścia to górne i dolne zaokrąglone panele mogą mieć inny kolor tła ze stroną internetową wewnątrz WebView, szczególnie gdy strona jest przewijana.

Answer 2

spróbować

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
     android:shape="rectangle" > 

    <corners 
     android:bottomRightRadius="10dp" android:bottomLeftRadius="10dp" 
     android:topLeftRadius="10dp" android:topRightRadius="10dp"/> 

     <stroke 
     android:color="@drawable/black" 
     android:width="3dp"/> 

</shape> 

Answer 3

To jest trochę dziwactwo Webview, ma domyślny kolor tła biały, sporządzony przed wszelkie rysunki. Musisz użyć następującego kodu, aby to przejrzysty i pokazać swoją rozciągliwej background:

WebView webview = (WebView)findViewById(R.id.webView1);   
webview.setBackgroundColor(0); 

Answer 4

Używam obrazu, który wygląda jak ramka obrazu, gdzie nadaję ramie zaokrąglone rogi. Połóż tę ramkę obrazu przez widok próbuję dać zaokrąglone rogi do.

To się ponad the problem in iBog's solution z paneli tła nie działa ładnie.

---

Sztuką jest użycie RelativeLayout; umieść w nim swój układ. Pod układem dodaj kolejny ImageView, ustawiając jego background na odpowiednią maskującą ramkę obrazu. To narysuje to na wierzchu twojego drugiego układu.

W moim przypadku zrobiłem plik 9Patch, który był szarym tłem, z wyciętym z niego przezroczystym zaokrąglonym prostokątem.

Stwarza to doskonałą maskę dla swojego podstawowego układu.

Kod XML może być coś takiego:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_height="wrap_content" android:layout_width="fill_parent"> 

    <!-- ... INSERT ANY VIEW HERE ... --> 

    <!-- FRAME TO MASK UNDERLYING VIEW --> 
    <ImageView android:layout_height="fill_parent" 
     android:layout_width="fill_parent" 
     android:background="@drawable/grey_frame" 
     android:layout_alignTop="@+id/mainLayout" 
     android:layout_alignBottom="@+id/mainLayout" /> 

</RelativeLayout> 

---

pełnej informacji można znaleźć w mojej oryginalnej odpowiedź tutaj:

• Android XML rounded clipped corners