布局的输出设计与开发布局

时间:2016-08-22 15:01:05

标签: android android-studio

我正在尝试设计一个布局(基本上是一个启动画面),它在屏幕的几乎中间显示App徽标,并在App开头的徽标下显示公司标语。在Android Studio中工作时,布局设计如下所示。我从顶部向下定位200dp。

如您所见,徽标位于屏幕中间。 但是当我在我的模拟器上运行应用程序时,屏幕显示为这样。徽标不在我想要的确切位置。

无论屏幕尺寸有多大,我都希望我的徽标处于相同的相对位置。

假设徽标位于200dp,长度为1000dp的屏幕上。我希望它在2000dp屏幕尺寸上的400dp位置。

模拟器:5.0.0 API-21 768 X 1280

有哪些可能的解决方案?

以下图片包含两个输出。

Follow this Link for the image

以下是XML代码:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical" android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#f84343"
android:weightSum="1">

<ImageView
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:id="@+id/AppIcon"
    android:src="@drawable/unnamed"
    android:layout_marginTop="200dp"
    android:layout_centerHorizontal="true" />

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="@string/simpler_better_faster"
    android:id="@+id/textView"
    android:layout_gravity="center_horizontal"
    android:layout_below="@+id/AppIcon"
    android:layout_centerInParent="true"
    android:layout_marginTop="50dp"
    android:textColor="#ffffff"
    android:textSize="20dp" />
</RelativeLayout>

3 个答案:

答案 0 :(得分:0)

您不需要使用<RelativeLayout>来实现这一目标。以下是使用<LinearLayout>的代码。这里的关键是android:gravity="center"元素中的<LinearLayout>

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

    <ImageView
        android:id="@+id/AppIcon"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:src="@drawable/unnamed"/>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:text="@string/simpler_better_faster"
        android:textColor="#ffffff"
        android:textSize="20dp"/>

</LinearLayout>

<强> [编辑]

  

OP - 但如果我继续在屏幕上使用更多小部件,我可能需要   将它们相对于彼此定位。如何克服这一点   相对布局

嗯,从技术上讲,您仍然可以按所需顺序添加更多小部件。但是,如果你真的想使用<RelativeLayout>,你可以使用类似的东西:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="#f84343"
                android:gravity="center_vertical">

    <ImageView
        android:id="@+id/AppIcon"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerHorizontal="true"
        android:src="@drawable/unnamed"/>

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:layout_below="@id/AppIcon"
        android:text="@string/simpler_better_faster"
        android:textColor="#ffffff"
        android:layout_centerHorizontal="true"
        android:textSize="20dp"/>

</RelativeLayout>

答案 1 :(得分:0)

看起来你混淆了一些RelativeLayout / LinearLayout属性。

如果要使用RelativeLayout删除并修改某些属性。

这样的东西

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

  <ImageView
      android:layout_width="100dp"
      android:layout_height="100dp"
      android:id="@+id/AppIcon"
      android:src="@drawable/unnamed"
      android:layout_centerInParent="true"/>

    <TextView
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="@string/simpler_better_faster"
      android:layout_below="@id/AppIcon"
      android:id="@+id/textView"
      android:layout_marginTop="50dp"
      android:textColor="#ffffff"
      android:textSize="20dp" />
</RelativeLayout>

答案 2 :(得分:0)

如果你问我

,将它全部简化为TextView
var
  A: TArray<Integer>;
  Mem: TArray<Int64>;
  N, i: Integer;

  function Calc(N: Integer): Int64;
  var
    i: Integer;
  begin
    if Mem[N] >= 0 then
      Exit(Mem[N]);

    i := 0;
    Result := 0;
    while A[i] <= N do begin
      Result := Result + Calc(N - A[i]);
      Inc(i);
    end;
    Mem[N] := Result;
  end;

begin
  //should be sorted
  //-1 - sentinel value to stop
  A := TArray<Integer>.Create(1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 20, 30, 40, 50, 60,
    70, 80, 90, 100, 200, 300, 400, 500, 600, 700, 800, 900, 1000, -1);
  for N := 10 to 64 do begin
    SetLength(Mem, N + 1);
    for i := 1 to N do
      Mem[i] := -1; //not initialized yet
    Mem[0] := 1;
    Memo1.Lines.Add(Format('%d   %d', [N, Calc(N)]));
  end;

这一切都消除了ImageView,更改是<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#f84343" > <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="@string/simpler_better_faster" android:drawableTop="@drawable/arrow_right_fill_dark" /> </RelativeLayout> 属性,提供了一个可绘制的,居中于文本上方。