web-dev-qa-db-ja.com

取得方法Androidグラデーションセンターライト効果？

次の画像のようなものが欲しい

enter image description here

描画可能な形状を使用して試しました

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
Android:shape="rectangle" >
<gradient
    Android:angle="360"
    Android:centerX="50%"
    Android:centerY="50%"

    Android:gradientRadius="50%"
    Android:endColor="#000000"
    Android:centerColor="#FFFFFF"
    Android:startColor="#000000" >
</gradient>
</shape>
androidandroid-drawablexml-drawable
35
Ajeet47

描画可能フォルダーに新しいAndroid xmlファイル（GreyRadial.xmlなど）ファイルを作成します。

Xmlファイルで

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
    Android:shape="rectangle" >

    <gradient
        Android:centerColor="#c1c1c1"
        Android:endColor="#4f4f4f"
        Android:gradientRadius="400"
        Android:startColor="#c1c1c1"
        Android:type="radial" >
    </gradient>

</shape>

を使用してレイアウトの背景でこのxmlを使用します

Android:background="@drawable/GreyRadial"
80
Himanshu Joshi

複数の長方形の形状を使用して、レイヤーリストで効果を近似できます。中央の背景色で塗りつぶされた長方形を使用します。次に、開始色と終了色が同じ2つのグラデーションを使用します。アルファをゼロに設定する以外は、中央の色も同じにします。

以下のコードでは、色は次のとおりです。

@color/background_dark = #ffb8860b
@color/background_light = #ffd2b48c
@color/transparent = #00b8860b

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:Android="http://schemas.Android.com/apk/res/Android" >
    <item>
        <shape >
            <solid Android:color="@color/background_light"/>
        </shape>
    </item>

    <item>
        <shape>
            <gradient 
                Android:startColor="@color/background_dark"
                Android:centerColor="@color/transparent"
                Android:endColor="@color/background_dark"
                Android:angle="45"/>
        </shape>
    </item>

    <item>
        <shape>
            <gradient 
                Android:startColor="@color/background_dark"
                Android:centerColor="@color/transparent"
                Android:endColor="@color/background_dark"
                Android:angle="135"/>
        </shape>
    </item>

</layer-list>
17
Steven Walters

もう一度ソリューション：

<shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
       Android:shape="rectangle">
    <gradient
        Android:centerX="50%"
        Android:centerY="50%"
        Android:endColor="@Android:color/black"
        Android:gradientRadius="100%"
        Android:startColor="@Android:color/transparent"
        Android:type="radial"/>
</shape>
10
Vadym

必要な楕円の縦横比が固定されている場合は、グラデーションのドロウアブルを背景として使用し、scaleXまたはscaleYを使用して楕円に引き伸ばすことができます。

描画可能なmyradial.xml：

   <?xml version="1.0" encoding="utf-8"?>
   <shape xmlns:Android="http://schemas.Android.com/apk/res/Android"
          Android:shape="rectangle">
       <!--Radial gradient centered at middle of top with glow color-->
       <gradient
           Android:startColor="FF336699"
           Android:endColor="00000000"
           Android:centerX="50%"
           Android:centerY="50%"
           Android:gradientRadius="50%"
           Android:type="radial"/>
   </shape>

背景として使用するビュー

   <View
       Android:layout_width="200dp"
       Android:layout_height="100dp"
       Android:background="@drawable/myradial"
       Android:scaleX="0.5"
       />

アスペクト比が固定されていない場合でも、実行時にコードでscaleXを設定できる可能性があります。

これは、すべての状況ですべての人に有効というわけではありません。難しいレイアウトになります。 1つの素晴らしい点は、ソリッド上の2つの線形グラデーションでポストされた非常にエレガントなソリューションの3つのパスと比較して、単一のレンダリングパスです。また、22.5度の角度で線形グラデーションを作成するなど、グラデーションを引き伸ばすためにも使用できます。

0
leorleor

これが私の問題の解決策です。

<shape Android:shape="rectangle">

 <gradient
     Android:endColor="@color/your_dark_color"
     Android:startColor="@color/your_light_color"
     Android:type="radial"
     Android:gradientRadius="700"/>

Android:gradientRadiusの値を変更することで、正確な結果を得ることができました。

0
Unaiza Khalid