我怎样才能将这个活动设计成方形风格

时间:2016-01-07 19:09:26

标签: android android-layout

我有activity_main.xml嵌套linear layout用于创建块,但我对此xml代码有一点问题:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <android.support.v7.widget.Toolbar
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/xmlToolbarMain"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="#f44336"/>

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical"
            tools:context="gridheader.majid.com.bahaltarinha.MainActivity">

            <!-- row  1 -->

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="3dp">

                <!-- Cooking -->
                <ImageView
                    android:layout_width="0dp"
                    android:layout_height="130dp"
                    android:layout_marginRight="2dp"
                    android:layout_weight="1"
                    android:scaleType="fitXY"
                    android:src="@drawable/cooking_r" />

                <!-- Celebrity -->
                <ImageView
                    android:layout_width="0dp"
                    android:layout_height="130dp"
                    android:layout_marginLeft="2dp"
                    android:layout_marginRight="2dp"
                    android:layout_weight="2"
                    android:scaleType="fitXY"
                    android:src="@drawable/celebrity_r" />

            </LinearLayout>

            <!-- row  2 -->
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="2dp">

                <!-- MakeUp -->
                <ImageView
                    android:layout_width="0dp"
                    android:layout_height="260dp"
                    android:layout_marginLeft="3dp"
                    android:layout_marginRight="2dp"
                    android:layout_weight="2"
                    android:background="#63ae4f"
                    android:scaleType="fitXY"
                    android:src="@drawable/makeup_r" />

                <LinearLayout
                    android:layout_width="0dp"
                    android:layout_height="260dp"
                    android:layout_marginLeft="2dp"
                    android:layout_weight="1"
                    android:orientation="vertical">


                    <!-- Kids -->

                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="130dp"
                        android:layout_marginBottom="2dp"
                        android:layout_marginRight="2dp"
                        android:layout_weight="1"
                        android:scaleType="fitXY"
                        android:src="@drawable/kids_r" />


                    <!-- Fashion -->
                    <ImageView
                        android:layout_width="match_parent"
                        android:layout_height="130dp"
                        android:layout_marginRight="2dp"
                        android:layout_marginTop="2dp"
                        android:layout_weight="1"
                        android:scaleType="fitXY"
                        android:src="@drawable/fashion_r" />

                </LinearLayout>

            </LinearLayout>

            <!-- row  3 -->

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_margin="2dp"
                android:orientation="horizontal">

                <!-- LifeStyle  -->
                <ImageView
                    android:layout_width="0dp"
                    android:layout_height="130dp"
                    android:layout_marginLeft="2dp"
                    android:layout_marginRight="2dp"
                    android:layout_weight="1"
                    android:scaleType="fitXY"
                    android:src="@drawable/lifestyle_r" />

                <!-- taghzieh  -->
                <ImageView
                    android:layout_width="0dp"
                    android:layout_height="130dp"
                    android:layout_marginLeft="1dp"
                    android:layout_marginRight="2dp"
                    android:layout_weight="1"
                    android:scaleType="fitXY"
                    android:src="@drawable/nutr_r" />

            </LinearLayout>
            <!-- Fal -->

            <!--<ImageView-->
            <!--android:layout_margin="2dp"-->
            <!--android:layout_width="match_parent"-->
            <!--android:layout_height="130dp"-->
            <!--android:background="#e74c3c"/>-->


            <!-- row  4 -->


        </LinearLayout>
    </ScrollView>
</LinearLayout>

这是从布局拍摄的屏幕。左边的图像是我的activity_main,图像右边是我想要的布局。我想以方形样式(具有相同的长度和宽度)显示图像而不是拉伸矩形:

enter image description here

好的,我希望你能达到我的目的,我认为这个形象很有用:

2 个答案:

答案 0 :(得分:1)

将图像视图的比例类型从fit_xy更改为center_crop

这应该可以解决扭曲的图像。

答案 1 :(得分:1)

为图像添加相同的布局宽度和高度,并使用centerCrop而不是fitXY作为scaleType

祝你好运!