我将如何创建此布局

问题描述：

我知道这不可能是最好的标题，所以如果您有更好的标题，请编辑。我将如何创建此布局

好的，所以我有一个模拟了我想在android中创建的部分设计，我将在后面进行介绍。

我不是最好的自定义形状的工作，所以我想我可能会沿着Images with clickable areas的路线。这意味着我只是导入图像，并只监视用户是否点击屏幕的一部分。

什么是最好的方法？

如果用XML创建它更好，你有一个很好的教程，你可以指向我。

感谢

创建的RelativeLayout作为主要布局。接下来添加LinearLayout（垂直），其中将包含两个水平布局。并添加Imageview（设置为alignCenterinparent =圆圈类型之前关闭相对 –

听起来像一个很好的方法，我会给它之前。 – SammyG

答

这可能有助于

<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:id="@+id/activity_main" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
android:paddingBottom="16dp" 
android:paddingLeft="16dp" 
android:paddingRight="16dp" 
android:paddingTop="16dp"> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    android:weightSum="2"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:weightSum="2" 
     android:orientation="horizontal"> 

     <Button 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:text="Button 1"/> 

     <Button 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:text="Button 2"/> 


    </LinearLayout> 


    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:weightSum="2" 
     android:orientation="horizontal"> 

     <Button 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:text="Button 3"/> 

     <Button 
      android:layout_width="match_parent" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:text="Button 4"/> 

    </LinearLayout> 

</LinearLayout> 

<Button 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:layout_centerInParent="true" 
    android:background="@drawable/circle"/></RelativeLayout>

请绘制文件夹这个文件命名为圆形按钮背景圈子

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

<size android:width="200dp" android:height="200dp" /> 
<solid android:color="@android:color/holo_red_light" /></shape>

看起来像这样

看起来不错，谢谢。由于某些原因，圆形不是在设计器中呈现，但我将不得不找出最新的错误（我有形状名为圈）但这是伟大的感谢，我将这标记为答案:)（现在已经呈现....新的Android工作室是一个小马车） – SammyG

你有问题圈？只需在res中创建drawable文件夹并在里面保留一个xml文件以获得圆形背景，比如说说circle.xml并将其保存在其中。代码： – Abhishek

将此文件作为背景添加到中心按钮布局文件 – Abhishek

答

下面是一个全面的测试布局

<?xml version="1.0" encoding="utf-8"?> 
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"> 

    <Button 
     android:id="@+id/btn_1" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:text="Button one"/> 

    <Button 
     android:id="@+id/btn_2" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:layout_toRightOf="@id/btn_1" 
     android:text="Button two"/> 

    <Button 
     android:id="@+id/btn_3" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:text="Button three" 
     android:layout_below="@id/btn_1"/> 

    <Button 
     android:id="@+id/btn_4" 
     android:layout_width="100dp" 
     android:layout_height="wrap_content" 
     android:layout_below="@id/btn_2" 
     android:layout_toRightOf="@id/btn_3" 
     android:text="Button four"/> 

    <ImageView 
     android:id="@+id/logo" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_centerInParent="true" 
     android:translationZ="10dp" 
     android:src="@drawable/ti_logo"/> 

</RelativeLayout>

答

@ SammyG您可以在此布局按照您的要求修改..

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 
xmlns:tools="http://schemas.android.com/tools" 
android:id="@+id/activity_main" 
android:layout_width="match_parent" 
android:layout_height="match_parent" 
tools:context="com.example.android.stackoverflow_test.MainActivity"> 

<LinearLayout 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" 
    android:weightSum="2"> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" 
     android:orientation="horizontal"> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@android:color/holo_green_dark" 
      android:padding="20dp" /> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@android:color/black" 
      android:padding="20dp" /> 
    </LinearLayout> 

    <LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" 
     android:orientation="horizontal"> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@android:color/holo_red_dark" 
      android:padding="20dp" /> 

     <TextView 
      android:layout_width="0dp" 
      android:layout_height="match_parent" 
      android:layout_weight="1" 
      android:background="@android:color/holo_blue_bright" 
      android:padding="20dp" /> 
    </LinearLayout> 
</LinearLayout> 

<ImageView 
    android:layout_width="150dp" 
    android:layout_height="150dp" 
    android:layout_centerInParent="true" 
    android:background="@mipmap/ic_launcher" /></RelativeLayout>

我将如何创建此布局

相关推荐