如何与重力均匀分布线性布局项目



在我的布局中,我正在尝试使用线性布局和相对布局来创建网格效果,并且我已经成功地做到了,但是结果并不像预期的那样准确,线性布局中方向设置为水平的项目水平对齐,但每当项目计数(即文本)发生变化时,它们的重力和对齐方式就会发生变化,我也尝试使用相对布局和网格布局,但没有帮助对此的任何建议将不胜感激。

这是我的布局:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
android:layout_width="match_parent"
android:background="@drawable/ic_bg"
android:layout_height="match_parent">
<RelativeLayout
android:layout_width="match_parent"
android:id="@+id/locklay"
android:layout_height="match_parent">
<ImageView
android:layout_width="@dimen/_30sdp"
android:src="@drawable/ic_wifi_shield"
android:id="@+id/imgwifi"
android:layout_marginTop="@dimen/_10sdp"
android:layout_marginLeft="@dimen/_10sdp"
android:layout_height="@dimen/_30sdp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/_15sdp"
android:layout_marginTop="@dimen/_15sdp"
android:layout_toRightOf="@id/imgwifi"
android:fontFamily="@font/roboto_medium"
android:text="WiFi Thief Detector"
android:textColor="@android:color/white"
android:textSize="@dimen/_15ssp" />
<ImageView
android:layout_width="@dimen/_30sdp"
android:src="@drawable/ic_settings"
android:id="@+id/imgsetting"
android:layout_alignParentRight="true"
android:layout_marginRight="@dimen/_10sdp"
android:layout_marginTop="@dimen/_10sdp"
android:layout_height="@dimen/_30sdp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_below="@+id/imgwifi"
android:layout_height="match_parent"
android:weightSum="100"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:id="@+id/lnr1"
android:layout_weight="25"
android:weightSum="100"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:orientation="vertical"
android:layout_weight="50"
android:layout_marginLeft="@dimen/_30sdp"
android:layout_marginTop="@dimen/_20sdp"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:id="@+id/time"
android:textSize="@dimen/_35ssp"
android:text="12:46"
android:layout_below="@+id/imgwifi"
android:textColor="@android:color/white"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:id="@+id/date"
android:textSize="@dimen/_10ssp"
android:text="Wednesday, 10 July"
android:layout_below="@+id/time"
android:textColor="@android:color/white"
android:layout_marginTop="@dimen/_5sdp"
android:layout_height="wrap_content" />
</LinearLayout>
<RelativeLayout
android:layout_weight="50"
android:layout_marginLeft="@dimen/_10sdp"
android:layout_marginRight="@dimen/_10sdp"
android:layout_gravity="center"
android:layout_width="@dimen/_150sdp"
android:layout_height="@dimen/_100sdp">
<me.itangqi.waveloadingview.WaveLoadingView
android:id="@+id/indicator"
android:layout_width="@dimen/_120sdp"
android:layout_height="@dimen/_60sdp"
android:layout_marginLeft="@dimen/_18sdp"
app:wlv_shapeType="rectangle"
app:wlv_round_rectangle="false"
app:wlv_triangle_direction="west"
app:wlv_waveAmplitude="70"
app:wlv_waveColor="@android:color/holo_green_light"
android:layout_marginTop="@dimen/_20sdp" />
<ImageView
android:layout_width="match_parent"
android:src="@drawable/ic_battery"
android:layout_height="match_parent" />
</RelativeLayout>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_below="@+id/lnr1"
android:layout_marginLeft="@dimen/_20sdp"
android:layout_marginRight="@dimen/_20sdp"
android:id="@+id/tvtitle"
android:textColor="@android:color/white"
android:gravity="center"
android:text="Real-Time Protection Network"
android:layout_marginTop="@dimen/_20sdp"
android:fontFamily="@font/roboto_medium"
android:textSize="@dimen/_15ssp"
android:layout_height="wrap_content" />
<RelativeLayout
android:layout_gravity="center"
android:layout_weight="25"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<com.airbnb.lottie.LottieAnimationView
android:id="@+id/scanninganim"
android:layout_width="@dimen/_150sdp"
android:layout_marginTop="@dimen/_10sdp"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
app:lottie_fileName="data.json"
app:lottie_autoPlay="true"
app:lottie_loop="true"
android:layout_marginBottom="@dimen/_10sdp"
android:layout_height="@dimen/_150sdp" />
<ImageView
android:layout_width="@dimen/_100sdp"
android:layout_centerVertical="true"
android:layout_marginTop="@dimen/_32sdp"
android:layout_centerHorizontal="true"
android:src="@drawable/ic_animation_circle"
android:layout_height="@dimen/_100sdp" />
<RelativeLayout
android:layout_width="wrap_content"
android:layout_marginTop="@dimen/_52sdp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_height="wrap_content">
<ImageView
android:layout_width="@dimen/_70sdp"
android:layout_centerVertical="true"
android:src="@drawable/ic_magnifier"
android:id="@+id/magnifyglass"
android:layout_centerHorizontal="true"
android:layout_height="@dimen/_70sdp" />
<com.airbnb.lottie.LottieAnimationView
android:id="@+id/wifiwiper"
android:layout_width="@dimen/_70sdp"
android:layout_height="@dimen/_70sdp"
android:layout_marginTop="@dimen/_5sdp"
app:lottie_fileName="372-wifi-wiper.json"
android:layout_marginLeft="@dimen/_3sdp"
android:layout_marginRight="@dimen/_5sdp"
android:layout_marginBottom="@dimen/_5sdp"
app:lottie_autoPlay="true"
app:lottie_loop="true"></com.airbnb.lottie.LottieAnimationView>
</RelativeLayout>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:id="@+id/lywifiname"
android:layout_below="@+id/scanninganim"
android:layout_height="wrap_content">
<ImageView
android:layout_width="@dimen/_25sdp"
android:src="@drawable/ic_wifi"
android:layout_marginLeft="@dimen/_35sdp"
android:layout_toLeftOf="@id/tvwifiname"
android:layout_height="@dimen/_25sdp" />
<TextView
android:id="@+id/tvwifiname"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="@dimen/_10sdp"
android:layout_gravity="center"
android:fontFamily="@font/roboto_medium"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:text="Dlink Connected"
android:textColor="@android:color/white"
android:textSize="@dimen/_15ssp" />
</RelativeLayout>
<LinearLayout
android:layout_below="@+id/lywifiname"
android:orientation="vertical"
android:id="@+id/lydevicesdet"
android:layout_marginBottom="@dimen/_10sdp"
android:layout_weight="25"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_weight="100"
android:layout_marginTop="@dimen/_20sdp"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:orientation="horizontal"
android:weightSum="50"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:textColor="@android:color/white"
android:text="125"
android:id="@+id/tvonlinedevicecount"
android:layout_weight="25"
android:layout_gravity="center"
android:gravity="center|left"
android:fontFamily="@font/roboto_medium"
android:layout_marginLeft="@dimen/_20sdp"
android:textSize="@dimen/_15ssp"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:textColor="@android:color/white"
android:layout_marginLeft="@dimen/_15sdp"
android:layout_gravity="center"
android:gravity="center|right"
android:id="@+id/onlinetext"
android:text="Online Devices"
android:layout_weight="25"
android:fontFamily="@font/roboto_medium"
android:textSize="@dimen/_12ssp"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:orientation="horizontal"
android:weightSum="50"
android:layout_marginLeft="@dimen/_30sdp"
android:layout_height="wrap_content">
<TextView
android:id="@+id/tvstrangerdevicescount"
android:layout_weight="25"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|left"
android:gravity="center"
android:textColor="@android:color/white"
android:layout_marginLeft="@dimen/_10sdp"
android:text="125"
android:textSize="@dimen/_15ssp"
android:layout_toRightOf="@+id/onlinetext"
/>
<TextView
android:layout_width="wrap_content"
android:layout_weight="25"
android:textColor="@android:color/white"
android:layout_marginLeft="@dimen/_15sdp"
android:text="Stranger Devices"
android:layout_gravity="center|right"
android:gravity="center"
android:fontFamily="@font/roboto_medium"
android:textSize="@dimen/_12ssp"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_marginTop="@dimen/_10sdp"
android:layout_height="wrap_content">
<LinearLayout
android:layout_width="wrap_content"
android:orientation="horizontal"
android:weightSum="50"
android:layout_height="wrap_content">
<TextView
android:layout_width="match_parent"
android:textColor="@android:color/white"
android:text="155"
android:layout_gravity="center"
android:gravity="center|left"
android:layout_weight="25"
android:id="@+id/tvofflinedevicecount"
android:fontFamily="@font/roboto_medium"
android:layout_marginLeft="@dimen/_20sdp"
android:textSize="@dimen/_15ssp"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:textColor="@android:color/white"
android:layout_marginLeft="@dimen/_17sdp"
android:text="Offline Devices"
android:layout_gravity="center"
android:gravity="center|right"
android:id="@+id/tvoffdev"
android:layout_weight="25"
android:fontFamily="@font/roboto_medium"
android:textSize="@dimen/_12ssp"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:orientation="horizontal"
android:weightSum="50"
android:layout_marginLeft="@dimen/_30sdp"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:textColor="@android:color/white"
android:text="155"
android:layout_weight="25"
android:id="@+id/tvknowndevicescount"
android:layout_toRightOf="@+id/tvoffdev"
android:layout_gravity="center|left"
android:gravity="center"
android:layout_marginLeft="@dimen/_10sdp"
android:fontFamily="@font/roboto_medium"
android:textSize="@dimen/_15ssp"
android:layout_height="wrap_content" />
<TextView
android:layout_width="wrap_content"
android:textColor="@android:color/white"
android:layout_marginLeft="@dimen/_19sdp"
android:text="Known Devices"
android:layout_gravity="center"
android:gravity="center|right"
android:layout_weight="25"
android:fontFamily="@font/roboto_medium"
android:textSize="@dimen/_12ssp"
android:layout_height="wrap_content" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:layout_marginTop="@dimen/_3sdp"
android:gravity="center"
android:id="@+id/unlock"
android:layout_marginBottom="@dimen/_10sdp"
android:layout_weight="25"
android:layout_below="@+id/lydevicesdet"
android:layout_height="wrap_content">
<TextView
android:layout_width="wrap_content"
android:text="Swipe To Unlock"
android:fontFamily="@font/roboto_thin"
android:textSize="@dimen/_15ssp"
android:textColor="@android:color/white"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="@dimen/_25sdp"
android:src="@drawable/ic_keyboard_arrow_right_black_24dp"
android:layout_marginTop="@dimen/_2sdp"
android:layout_height="@dimen/_25sdp" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
</RelativeLayout>

据我所知,gravity/layout-gravity用于定位视图元素而不是分配空间。应使用layout_weight进行空间分配。

要使layout_weight应用于视图,您需要将layout_widthlayout_height值设置为0dp

  • 为了水平应用权重,我们需要将layout_width设置为0dp
  • 为了使权重垂直应用,我们需要将layout_height0dp

<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1" />
</LinearLayout>

使用布局权重和权重总和。例如,如果您需要创建 2 x 2 网格。

<!--Main parent layout-->
<LinearLayout
android:layout_width="match_parent"
android:orientation="horizontal"
android:weightSum="100"
android:layout_height="match_parent">
<!--Then devide the main parent layout with two horizental layouts -->
<!--First horizental layout-->
<LinearLayout 
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="verticle"
android:layout_weight = "50"
android:weightSum="100">
<!--Then devide each horizental layouts vertically to get grid like elements-->
<!--1st rows first column come here-->
<LinearLayout 
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="verticle"
android:layout_weight = "50">
</LinearLayout>
<!--1st rows second column come here-->
<LinearLayout 
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="verticle"
android:layout_weight = "50">
</LinearLayout>
</LinearLayout>
</LinearLayout>
<!--Second horizantal layout-->
<LinearLayout 
android:layout_width="match_parent"
android:layout_height="match_parent"        
android:orientation="verticle"
android:layout_weight = "50"
android:weightSum="100">
<!--2nd rows first column come here-->
<LinearLayout 
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="verticle"
android:layout_weight = "50">
</LinearLayout>
<!--2nd rows second column come here-->
<LinearLayout 
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="verticle"
android:layout_weight = "50">
</LinearLayout>
</LinearLayout>
</LinearLayout>

像这样使用layout_weight:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/contParentLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content">
<TextView
android:layout_width="0dp"
android:text="19"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:text="Online Device"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2" />
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:layout_width="0dp"
android:layout_height="wrap_content">

<TextView
android:layout_width="0dp"
android:text="19"
android:gravity="center"
android:layout_height="wrap_content"
android:layout_weight="1" />
<TextView
android:text="Online Device"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="2" />

</LinearLayout>
</LinearLayout>

最新更新