Вопрос по java, rounded-corners, android – Android: дать webview закругленные углы?

11

Я пытаюсь придать моему webView закругленные углы.

Вот мой код:

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>

И вот мой 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"/>

Но это просто не сработает! Углы не закруглены ...

Вы можете попытаться добавить в веб-представление округлое фиктивное представление ... Так что оно останется за рамками и будет казаться округлым. yahya

Ваш Ответ

6   ответов
4

попробуй это

<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>
0

Ни одно из решений не сработало для меня. Это сработало для меня. Перед загрузкой данных необходимо установить

webView.getSettings().setUseWideViewPort(true);

и применил вас в XML-файле.

Это сработало для меня.

13

Единственный способ - обернуть элемент WebView другим представлением (например, FrameLayout) и применить фон с закругленными углами к внешнему виду. Пример:

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

Where paddingTop and paddingBottom equals radius from drawable/white_rounded_area, paddingLeft and paddingRight equals stroke width drawable/white_rounded_area.

Минус этого подхода - сверху и снизу округлые панели могут иметь различный цвет фона с веб-страницей внутри WebView, особенно при прокрутке страницы.

0

Вы можете использовать CardView, чтобы содержать веб-вид, и вам просто нужно добавить угловой радиус, который вы хотите сapp:cardCornerRadius :

    <android.support.v7.widget.CardView
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:cardCornerRadius="10dp">                    // HERE

            <WebView
                android:id="@+id/webView"
                android:layout_width="match_parent"
           ,     android:layout_height="match_parent" />

    </android.support.v7.widget.CardView>

И это все

19

Это небольшая странность Webview, он имеет цвет фона по умолчанию - белый, который рисуется перед всеми объектами рисования. Вам нужно будет использовать следующий код, чтобы сделать его прозрачным и показать фон для рисования:

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

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

Это становится болеепроблема в решении iBog фоновые панели не работают хорошо.


Хитрость заключается в использованииRelativeLayout; поместите ваш макет внутри него. Ниже вашего макета добавьте еще одинImageView, установив егоbackground в подходящую рамку маскирующего изображения. Это нарисует это поверх вашего другого макета.

В моем случае я сделал файл 9Patch на сером фоне с вырезанным из него прозрачным скругленным прямоугольником.

frame

Это создает идеальную маску для вашего основного макета.

Код XML может быть примерно таким:

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

Полную информацию можно найти в моем оригинальном ответе здесь:

Похожие вопросы