android - Androidで別のボタンの中央にボタンを配置する方法

Question

ボタン1とボタン2の2つの画像ボタンがあります。ボタン 1 には大きな画像を設定し、ボタン 2 には小さな画像を設定しています。ボタン 2 をボタン 1 のちょうど中央に配置する必要があります。どうすればこれを達成できますか?

私は相対レイアウトを使用しており、XMLファイルでこの変更を行う必要があります。両方のボタンのクリック イベントも別々に受け取る必要があります。

以下のコードを試しましたが、個別のクリック イベントを受信して​​いません。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
    android:id="@+id/linearLayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:src="@drawable/mainscreen"
        android:scaleType="fitXY" />

    <com.google.ads.AdView
        android:id="@+id/adView"
        android:layout_width="320dp"
        android:layout_height="50dp"
        ads:adUnitId="xxxx"
        ads:adSize="BANNER"
        ads:loadAdOnCreate="true"/>

    <ImageButton android:id="@+id/star"
        android:layout_width ="wrap_content"
        android:layout_height ="wrap_content"
        android:layout_toRightOf="@+id/adView"
        android:src="@drawable/star"
        android:background="@layout/selector"
        android:layout_marginLeft="40dp"
        android:focusable="false" />

    <ImageButton android:id="@+id/image1"
        android:layout_width ="wrap_content"
        android:layout_height ="wrap_content"
        android:layout_below="@+id/adView"
        android:src="@drawable/drum"
        android:background="@layout/selector"
        android:layout_marginTop="30dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="10dp"
        android:focusable="false" />
    <ImageButton android:id="@+id/image2"
        android:layout_width ="wrap_content"
        android:layout_height ="wrap_content"
        android:src="@drawable/drum1"
        android:layout_alignLeft="@+id/image1"
        android:layout_alignTop="@+id/image1"
        android:layout_alignRight="@+id/image1"
        android:layout_alignBottom="@+id/image1"
        android:focusable="false" />

    <ImageButton android:id="@+id/image3"
        android:layout_width ="wrap_content"
        android:layout_height ="wrap_content"
        android:src="@drawable/drum2"
        android:background="@layout/selector"
        android:layout_alignLeft="@+id/image1"
        android:layout_alignTop="@+id/image1"
        android:layout_alignRight="@+id/image1"
        android:layout_alignBottom="@+id/image1"
        android:focusable="false" />

    <ImageButton android:id="@+id/image4"
        android:layout_width ="wrap_content"
        android:layout_height ="wrap_content"
        android:layout_below="@+id/adView"
        android:src="@drawable/drum"
        android:background="@layout/selector"
        android:layout_marginTop="30dp"
        android:layout_toRightOf="@+id/image1"
        android:focusable="false" />

    <ImageButton android:id="@+id/image5"
        android:layout_width ="wrap_content"
        android:layout_height ="wrap_content"
        android:src="@drawable/drum1"
        android:background="@layout/selector"
        android:layout_alignLeft="@+id/image4"
        android:layout_alignTop="@+id/image4"
        android:layout_alignRight="@+id/image4"
        android:layout_alignBottom="@+id/image4"
        android:focusable="false" />

    <ImageButton android:id="@+id/image6"
        android:layout_width ="wrap_content"
        android:layout_height ="wrap_content"
        android:src="@drawable/drum2"
        android:background="@layout/selector"
        android:layout_alignLeft="@+id/image4"
        android:layout_alignTop="@+id/image4"
        android:layout_alignRight="@+id/image4"
        android:layout_alignBottom="@+id/image4"
        android:focusable="false" />
</RelativeLayout>

Answer 1

現在のレイアウトでは、アイテムをネストする必要があります。ただし、imagebutton の画像部分のみに関心があるため、私の例のように、現在「button1」と呼んでいるものに FrameLayout を使用できます (状況に合わせて調整してください)。

<FrameLayout android:id="@+id/button1"
  ...
  android:background="@drawable/image1"
  >

  <ImageButton
    android:id="@+id/button2"
    android:layout_gravity="center"
    android:src="@drawable/image2" />

</FrameLayout>

Answer 2

フレームレイアウトを使用します。button1を塗りつぶしの親として配置し、ボタン2をlayout_gravity="center"を使用してコンテンツの折り返しとして配置します。以下のコードを見てください。

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

        <ImageButton
            android:id="@+id/imageButton1"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@android:drawable/dialog_frame" />

        <ImageButton
            android:id="@+id/imageButton2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/pic_2" 
            android:layout_gravity="center"/>

    </FrameLayout>

Answer 3

両方のボタンを含むように FrameLayout を使用してみてください

Answer 4

2 番目のイメージには、属性を設定しますaligncenterinparent = true。