合并多个ImageView以形成心形

时间:2017-10-14 21:05:39

标签: android android-layout android-linearlayout android-relativelayout android-shape

如何获得此形状合并图像?

enter image description here

我有大约60 ImageView,我想合并它们以形成上述形状,每个ImageView具有不同的颜色。我尝试使用ImageViewrelative以及linear layout的组合来创建它,但我没有得到完全预期的输出。

1。这是实现它的正确方法吗? 2。如果是,我在哪里弄错了,如果不对,哪一个是正确的方法呢? 我怎样才能实现它?

这就是我所做的:

<RelativeLayout
    android:layout_marginLeft="120dp"
    android:layout_marginRight="120dp"
    android:layout_width="match_parent"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView1"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView2"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="120dp"
    android:layout_marginRight="120dp"
    android:layout_width="match_parent"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView3"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView4"
        />
</RelativeLayout>

<RelativeLayout
    android:layout_marginLeft="80dp"
    android:layout_marginRight="80dp"
    android:layout_width="match_parent"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/red_on"
        android:id="@+id/imageView6"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/red_on"
        android:id="@+id/imageView5"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="90dp"
    android:layout_marginRight="90dp"
    android:layout_width="match_parent"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView7"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView8"
        />
</RelativeLayout>


<RelativeLayout
    android:layout_marginLeft="100dp"
    android:layout_marginRight="100dp"
    android:layout_width="match_parent"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView9"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView10"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="110dp"
    android:layout_marginRight="110dp"
    android:layout_width="match_parent"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView11"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView12"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="120dp"
    android:layout_marginRight="120dp"
    android:layout_width="match_parent"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView14"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView13"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="130dp"
    android:layout_marginRight="130dp"
    android:layout_width="match_parent"
    android:id="@+id/linear8"
    android:layout_below="@+id/linear7"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView15"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView16"
       />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="140dp"
    android:layout_marginRight="140dp"
    android:layout_width="match_parent"
    android:id="@+id/linear9"
    android:layout_below="@+id/linear8"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView17"
         />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView18"
     />
       </>
<RelativeLayout
    android:layout_marginLeft="150dp"
    android:layout_marginRight="150dp"
    android:layout_width="match_parent"
    android:id="@+id/linear10"
    android:layout_below="@+id/linear9"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView19"
            />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView20"
      />
      </>
<RelativeLayout
    android:layout_marginLeft="160dp"
    android:layout_marginRight="160dp"
    android:layout_width="match_parent"
    android:id="@+id/linear11"
    android:layout_below="@+id/linear10"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView21"
          />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView22"
         />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="170dp"
    android:layout_marginRight="170dp"
    android:layout_width="match_parent"
    android:id="@+id/linear12"
    android:layout_below="@+id/linear11"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView23"
       />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView24"
       />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="180dp"
    android:layout_marginRight="180dp"
    android:layout_width="match_parent"
    android:id="@+id/linear13"
    android:layout_below="@+id/linear12"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView25"
       />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView26"
       />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="190dp"
    android:layout_marginRight="190dp"
    android:layout_width="match_parent"
    android:id="@+id/linear14"
    android:layout_below="@+id/linear13"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/red_on"
        android:id="@+id/imageView27" />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/red_on"
        android:id="@+id/imageView28"
        />
             </>
<RelativeLayout
    android:layout_marginLeft="200dp"
    android:layout_marginRight="200dp"
    android:layout_width="match_parent"
    android:id="@+id/linear15"
    android:layout_below="@+id/linear14"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView29"

         />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView30"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="210dp"
    android:layout_marginRight="210dp"
    android:layout_width="match_parent"
    android:id="@+id/linear16"
    android:layout_below="@+id/linear15"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView31"
        />

    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView32"
         />
             </>
<RelativeLayout
    android:layout_marginLeft="220dp"
    android:layout_marginRight="220dp"
    android:layout_width="match_parent"
    android:id="@+id/linear17"
    android:layout_below="@+id/linear16"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView33"

        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView134"
         />
          </>
<RelativeLayout
    android:layout_marginLeft="230dp"
    android:layout_marginRight="230dp"
    android:layout_width="match_parent"
    android:id="@+id/linear18"
    android:layout_below="@+id/linear17"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView35"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView36"
         />
           </>
<RelativeLayout
    android:layout_marginLeft="240dp"
    android:layout_marginRight="240dp"
    android:layout_width="match_parent"
    android:id="@+id/linear19"
    android:layout_below="@+id/linear18"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView37"
       />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView38"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="250dp"
    android:layout_marginRight="250dp"
    android:layout_width="match_parent"
    android:id="@+id/linear20"
    android:layout_below="@+id/linear19"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView39"
       />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView40"
         />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="260dp"
    android:layout_marginRight="260dp"
    android:layout_width="match_parent"
    android:id="@+id/linear21"
    android:layout_below="@+id/linear20"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView41"
   />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView42"
         />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="270dp"
    android:layout_marginRight="270dp"
    android:layout_width="match_parent"
    android:id="@+id/linear22"
    android:layout_below="@+id/linear21"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView43"
         />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView44"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="280dp"
    android:layout_marginRight="280dp"
    android:layout_width="match_parent"
    android:id="@+id/linear23"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView45"
         />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView46"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="290dp"
    android:layout_marginRight="290dp"
    android:layout_width="match_parent"
    android:id="@+id/linear24"
    android:layout_below="@+id/linear23"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView47"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView48"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_marginLeft="300dp"
    android:layout_marginRight="300dp"
    android:layout_width="match_parent"
    android:id="@+id/linear25"
    android:layout_below="@+id/linear24"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/red_on"
        android:id="@+id/imageView49"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/red_on"
        android:id="@+id/imageView50"
         />
</RelativeLayout>

<RelativeLayout
    android:layout_width="match_parent"
    android:id="@+id/linear27"
    android:layout_marginLeft="310dp"
    android:layout_marginRight="310dp"
    android:layout_below="@+id/linear26"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView53"
         />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView54"
         />
</RelativeLayout>
<RelativeLayout
    android:layout_width="match_parent"
    android:id="@+id/linear28"
    android:layout_marginLeft="320dp"
    android:layout_marginRight="320dp"
    android:layout_below="@+id/linear27"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView55"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView56"
        />
</RelativeLayout>

<RelativeLayout
    android:layout_width="match_parent"
    android:id="@+id/linear29"
    android:layout_below="@+id/linear28"
    android:layout_marginLeft="330dp"
    android:layout_marginRight="330dp"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView57"  />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView58"
        />
</RelativeLayout>
<RelativeLayout
    android:layout_width="match_parent"
    android:id="@+id/linear30"
    android:layout_below="@+id/linear29"
    android:layout_height="wrap_content"
    android:layout_marginLeft="350dp"
    android:layout_marginRight="350dp"
    >
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView59"

        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView60"
        />
</RelativeLayout>

<RelativeLayout
    android:layout_width="match_parent"
    android:id="@+id/linear26"
    android:layout_height="wrap_content"
    android:layout_below="@+id/linear25"
    android:layout_marginLeft="360dp"
    android:layout_marginRight="360dp"
    >
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:layout_alignParentLeft="true"
        android:background="@drawable/green_on"
        android:id="@+id/imageView51"
        />
    <ImageView
        android:layout_width="40dp"
        android:layout_height="40dp"
        android:background="@drawable/green_on"
        android:id="@+id/imageView52"
        android:layout_alignParentRight="true"/>
    </RelativeLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:id="@+id/linear31"
    android:layout_below="@+id/linear30"
    android:layout_height="wrap_content">
    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:srcCompat="@android:drawable/btn_star_big_on"
        android:id="@+id/imageView61"
        android:layout_weight="1" />
</LinearLayout>

0 个答案:

没有答案