Question

我正在制作一个android cv应用程序，但我想实现屏幕快照中显示的UI。 screenshot of ui I want 在实际设备的当前用户界面下方 current ui

实现UI的XML布局，其中包括ImageView和一些显示主题的TextView。我已经实现了所有任务，但是UI并未显示我想要的显示方式。

<?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="wrap_content"
    android:background="@color/colorBlust"
    android:orientation="vertical">


    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:baselineAligned="false"
        android:orientation="horizontal">

        <ImageView
            android:id="@+id/educationImage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginStart="5dp"
            android:layout_marginLeft="5dp"
            android:src="@drawable/education_information"
            tools:ignore="ContentDescription" />

        <TextView
            android:id="@+id/education_info"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:layout_marginStart="10dp"
            android:layout_marginLeft="10dp"
            android:text="@string/education_information"
            android:textColor="@color/colorWhite"
            android:textSize="20sp" />

    </LinearLayout>

    <TextView
        android:id="@+id/duration"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginStart="12dp"
        android:layout_marginLeft="12dp"
        android:text="@string/text_duration"
        android:textColor="@color/colorWhite"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/institution"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginStart="12dp"
        android:layout_marginLeft="12dp"
        android:text="@string/text_institution"
        android:textColor="@color/colorWhite"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/degree"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:layout_marginStart="12dp"
        android:layout_marginLeft="12dp"
        android:text="@string/text_degree"
        android:textColor="@color/colorWhite"
        android:textSize="16sp" />


    <Space
        android:layout_width="50dp"
        android:layout_height="50dp" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="horizontal">

            <ImageView
                android:id="@+id/subjectImage"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginStart="20dp"
                android:layout_marginLeft="20dp"
                android:src="@drawable/university_subjects"
                tools:ignore="ContentDescription" />

            <TextView
                android:id="@+id/subjects"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:layout_marginStart="100dp"
                android:layout_marginLeft="100dp"
                android:text="@string/university_subjects"
                android:textColor="@color/colorWhite"
                android:textSize="20sp" />

            <include
                layout="@layout/subject_list"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_below="@+id/subjects"
                android:layout_marginTop="60dp" />
        </RelativeLayout>


    </LinearLayout>

</LinearLayout>

我已经主观地创建了另一个适配器并创建了伪数据在适配器类下面

      public  class SubjectAdapter extends RecyclerView.Adapter<SubjectAdapter.ViewHolder> {

    private  SubjectActivity subjectActivity;
    private int [] subjectImage;
    String[] subjectText;
    List<FakeData> fakeData;



    public class ViewHolder extends RecyclerView.ViewHolder {
        public TextView subjects;
        public ImageView subjectImage;

        public ViewHolder(View view) {
            super(view);
            subjectImage = (ImageView) view.findViewById(R.id.subjectImage);
            subjects = (TextView) view.findViewById(R.id.subjects);


        }
    }

    public SubjectAdapter(SubjectActivity subjectActivity, int []subjectImage, String [] subjectText, List<FakeData> fakeData){
        this.subjectActivity = subjectActivity;
        this.subjectImage = subjectImage;
        this.subjectText = subjectText;
        this.fakeData = fakeData;

    }
        @Override
        public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            View itemView = LayoutInflater.from(parent.getContext())
                    .inflate(R.layout.subject_list, parent, false);

            return new ViewHolder(itemView);
        }

       @Override
        public void onBindViewHolder(ViewHolder holder, int position) {
            FakeData fake = fakeData.get(position);
            Picasso.get().load(fake.getImage()).
                    into(holder.subjectImage);
            holder.subjects.setText(fake.getSubjects());
        }


        // TODO Auto-generated constructor stub





    @Override
    public int getItemCount() {
        return fakeData.size() ;
    }
}

在托管RecyclerView的主题XML下面

<RelativeLayout 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.support.v7.widget.RecyclerView
    android:id="@+id/list"

    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_alignParentStart="true">
</android.support.v7.widget.RecyclerView>

在subject_list.xml下面，其中有主机项

<?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="@color/colorBlust"
    android:orientation="horizontal" >

    <ImageView
        android:id="@+id/icon"
        android:layout_width="60dp"
        android:layout_marginLeft="10dp"
        android:layout_height="60dp"
        android:padding="5dp"
        android:src="@drawable/computer_science"
        android:layout_marginStart="10dp" />

    <LinearLayout android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical">

        <TextView
            android:id="@+id/item"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/computers_science"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="5dp"
            android:padding="2dp"
            android:textColor="@color/colorWhite" />

    </LinearLayout>

我创建了虚假数据以托管其他图像和文本

在fakeModel类之下公共类FakeData {

public String getImage() {
    return image;
}

public void setImage(String image) {
    this.image = image;
}

public String getSubjects() {
    return subjects;
}

public void setSubjects(String subjects) {
    this.subjects = subjects;
}

String image;
String subjects;

}

在我使用RecyclerView扩展的适配器类下面公共类SubjectAdapter扩展了RecyclerView.Adapter {

private  SubjectActivity subjectActivity;
private int [] subjectImage;
String[] subjectText;
List<FakeData> fakeData;



public class ViewHolder extends RecyclerView.ViewHolder {
    public TextView subjects;
    public ImageView subjectImage;

    public ViewHolder(View view) {
        super(view);
        subjectImage = (ImageView) view.findViewById(R.id.subjectImage);
        subjects = (TextView) view.findViewById(R.id.subjects);


    }
}

public SubjectAdapter(SubjectActivity subjectActivity, int []subjectImage, String [] subjectText, List<FakeData> fakeData){
    this.subjectActivity = subjectActivity;
    this.subjectImage = subjectImage;
    this.subjectText = subjectText;
    this.fakeData = fakeData;

}
    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View itemView = LayoutInflater.from(parent.getContext())
                .inflate(R.layout.subject_list, parent, false);

        return new ViewHolder(itemView);
    }

   @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        FakeData fake = fakeData.get(position);
        Picasso.get().load(fake.getImage()).
                into(holder.subjectImage);
        holder.subjects.setText(fake.getSubjects());
    }


    // TODO Auto-generated constructor stub





@Override
public int getItemCount() {
    return fakeData.size() ;
}

}

在我的Subject类下，我已实现了虚假图像和数据

公共类SubjectActivity扩展了活动{

List<FakeData> fakeData;
int [] subjectImage = {R.drawable.computer_science,
        R.drawable.data_structure,

       };



ListView list;
String[] subjectText = {
        "Computer Science",
        "Data Structure",

};


@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.subject);


    RecyclerView  recyclerView= (RecyclerView) findViewById(R.id.list);
    SubjectAdapter adapter = new SubjectAdapter(SubjectActivity.this, subjectImage,
            subjectText, fakeData);
    RecyclerView.LayoutManager mLayoutManager = new LinearLayoutManager(getApplicationContext());
    recyclerView.setLayoutManager(mLayoutManager);
    recyclerView.setAdapter(adapter);


}

}

Answer 1

这似乎只使用了Android Studio的拖放功能来放置UI元素。问题是，Android Studio在通用设备中显示那些UI元素，而这些元素不会匹配所有设备。当我刚开始使用Android时，该文档对我了解了如何放置UI中的元素有很大帮助。

https://developer.android.com/studio/write/layout-editor

Answer 2

您的XML格式不正确。您的LinearLayout方向错误：

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal">

它应该是垂直。

然后验证其内容。您有多个具有方向属性的 RelativeLayout 。

应改为 LinearLayout 。 RelativeLayouts没有方向。

除了这些错误之外，您的布局非常复杂并且层次结构很深。这将导致性能问题。我对您的建议是学习如何使用ConstraintLayout。

学习曲线有点高，但是值得！

为什么UI无法正确显示？

2 个答案: