Android開發學習筆記整理(11)-homework2講解

代碼部分:

part1:

activity_main.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:orientation="vertical">
    
    <Button
        android:id="@+id/button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="演示輪播圖"
        android:onClick="showGuidance"/>

    <Button
        android:id="@+id/button2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="演示ListView"
        android:textAllCaps="false"
        android:onClick="showListView"/>

    <Button
        android:id="@+id/button3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="演示GridView"
        android:textAllCaps="false"
        android:onClick="showGridView"/>
    
</LinearLayout>

效果圖:

在這裏插入圖片描述

activity_guidance.xml

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

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

</RelativeLayout>

效果圖:

在這裏插入圖片描述

guidance_button_shape.xml

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

    <solid android:color="#03AEFB"></solid>
    <corners android:radius="25dp"></corners>

</shape>

效果圖:

在這裏插入圖片描述

guidance_item.xml

<?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:layout_width="match_parent" android:layout_height="match_parent">

    <ImageView
        android:id="@+id/iv_guidance"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:srcCompat="@drawable/guidance1"/>

    <RadioGroup
        android:id="@+id/rg_guidance"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_centerHorizontal="true"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="40dp">

    </RadioGroup>

    <Button
        android:id="@+id/b_guidance"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:text="開啓學習之旅"
        android:textSize="18sp"
        android:textColor="#FFFFFF"
        android:textStyle="bold"
        android:layout_marginLeft="25dp"
        android:layout_marginRight="25dp"
        android:layout_alignParentBottom="true"
        android:layout_marginBottom="40dp"
        android:background="@drawable/guidance_button_shape"
        android:visibility="gone"/>

</RelativeLayout>

效果圖:

在這裏插入圖片描述

guidance1.png

在這裏插入圖片描述

guidance2.png

請添加圖片描述

guidance3.png

請添加圖片描述

GuidanceAdapter.java

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.RadioButton;
import android.widget.RadioGroup;
import android.widget.Toast;
import androidx.annotation.NonNull;
import androidx.viewpager.widget.PagerAdapter;
import java.util.List;
public class GuidanceAdapter extends PagerAdapter {

    private List<Integer> data;
    private Context context;
    private LayoutInflater inflater;

    public GuidanceAdapter(List<Integer> data, Context context) {
        this.data = data;
        this.context = context;
        inflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        return data.size();
    }

    @Override
    public boolean isViewFromObject(@NonNull View view, @NonNull Object object) {
        return view == object;
    }

    @NonNull
    @Override
    public Object instantiateItem(@NonNull ViewGroup container, int position) {
        //1.獲取視圖和控件
        View view = inflater.inflate(R.layout.guidance_item, null);
        ImageView imageView = view.findViewById(R.id.iv_guidance);
        RadioGroup radioGroup = view.findViewById(R.id.rg_guidance);
        Button button = view.findViewById(R.id.b_guidance);

        //2.給組件賦值
        imageView.setImageResource(data.get(position));
        for (int i = 0; i < data.size(); i++) {
            //當判斷是最後一條數據時:隱藏RadioGroup,顯示Button
            if (position == (data.size()-1)) {
                radioGroup.setVisibility(View.GONE);
                button.setVisibility(View.VISIBLE);
                continue;
            } else {
                //當判斷不是最後一條數據
                RadioButton radioButton = new RadioButton(context);
                if (i == position) {
                    radioButton.setChecked(true);
                }
                radioGroup.addView(radioButton);
            }
        }
        button.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                Toast.makeText(context, "開始新徵程", Toast.LENGTH_SHORT).show();
            }

        });

        //3.將item添加到視圖容器中去
        container.addView(view);

        return view;
    }

    @Override
    public void destroyItem(@NonNull ViewGroup container, int position, @NonNull Object object) {
        container.removeView((View) object);
    }

}

GuidanceActivity.java

import androidx.appcompat.app.AppCompatActivity;
import androidx.viewpager.widget.ViewPager;
import android.os.Bundle;
import java.util.ArrayList;
import java.util.List;
public class GuidanceActivity extends AppCompatActivity {

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

        //引導圖數據
        List<Integer> data = new ArrayList<>();
        data.add(R.drawable.guidance1);
        data.add(R.drawable.guidance2);
        data.add(R.drawable.guidance3);

        //初始化ViewPager
        ViewPager viewPager = findViewById(R.id.viewPager);
        GuidanceAdapter adapter = new GuidanceAdapter(data, this);
        viewPager.setAdapter(adapter);
    }

}

效果圖:

在這裏插入圖片描述
在這裏插入圖片描述
在這裏插入圖片描述

part2:

activity_course.xml

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

    <ListView
        android:id="@+id/listView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:divider="@null"/>

</RelativeLayout>

效果圖:

在這裏插入圖片描述

Course.java

public class Course {

    private int image;
    private String name;
    private String intro;
    private double price;
    private double oldPrice;
    private int studyPerson;

    public Course(int image, String name, String intro, double price, double oldPrice, int studyPerson) {
        this.image = image;
        this.name = name;
        this.intro = intro;
        this.price = price;
        this.oldPrice = oldPrice;
        this.studyPerson = studyPerson;
    }

    public String getIntro() {
        return intro;
    }

    public void setIntro(String intro) {
        this.intro = intro;
    }

    public int getImage() {
        return image;
    }

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

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public double getPrice() {
        return price;
    }

    public void setPrice(double price) {
        this.price = price;
    }

    public double getOldPrice() {
        return oldPrice;
    }

    public void setOldPrice(double oldPrice) {
        this.oldPrice = oldPrice;
    }

    public int getStudyPerson() {
        return studyPerson;
    }

    public void setStudyPerson(int studyPerson) {
        this.studyPerson = studyPerson;
    }

}

course_shape.xml

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

    <corners android:radius="20dp"></corners>
    <stroke android:color="#BBBBBB"></stroke>
    <solid android:color="#F5F9FC"></solid>

</shape>

效果圖:

在這裏插入圖片描述

course_item.xml

<?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="140dp"
    android:minHeight="140dp">

    <ImageView
        android:id="@+id/image"
        android:layout_width="100dp"
        android:layout_height="120dp"
        android:src="@drawable/study1"
        android:layout_marginLeft="20dp"
        android:layout_centerVertical="true"/>

    <TextView
        android:id="@+id/name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="大自然界"
        android:textSize="16sp"
        android:textColor="#101010"
        android:textStyle="bold"
        android:layout_marginTop="10dp"
        android:layout_toRightOf="@id/image"
        android:layout_marginLeft="10dp" />

    <TextView
        android:id="@+id/intro"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="大自然很新奇"
        android:layout_below="@id/name"
        android:layout_alignLeft="@id/name"
        android:layout_marginTop="5dp"
        android:textSize="12sp"
        android:textColor="#999999"/>

    <TextView
        android:id="@+id/price"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="¥19.9"
        android:layout_below="@id/intro"
        android:layout_alignLeft="@id/intro"
        android:layout_marginTop="5dp"
        android:textSize="24sp"
        android:textColor="#FF5942"
        android:textStyle="bold"/>

    <TextView
        android:id="@+id/oldPrice"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="¥300"
        android:layout_toRightOf="@id/price"
        android:layout_alignBottom="@id/price"
        android:layout_marginLeft="10dp"
        android:textSize="12sp"
        android:textColor="#C7C7C7"/>

    <TextView
        android:id="@+id/studyPerson"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="10000人在學習"
        android:layout_below="@id/price"
        android:layout_alignLeft="@id/price"
        android:layout_marginTop="5dp"
        android:textSize="12sp"
        android:textColor="#999999"
        android:textStyle="bold"
        android:background="@drawable/course_shape"
        android:padding="6dp"/>

    <View
        android:layout_width="match_parent"
        android:layout_height="1dp"
        android:background="#EFEFEF"
        android:layout_alignParentBottom="true"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"/>

</RelativeLayout>

效果圖:

在這裏插入圖片描述

study1.png

在這裏插入圖片描述

study2.png

請添加圖片描述

study3.png

請添加圖片描述

CourseAdapter.java

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.List;
public class CourseAdapter extends BaseAdapter {

    private List<Course> data;
    private Context context;
    private LayoutInflater inflater;

    public CourseAdapter(List<Course> data, Context context) {
        this.data = data;
        this.context = context;
        this.inflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        return data.size();
    }

    @Override
    public Object getItem(int position) {
        return data.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder viewHolder;
        if (convertView == null) {
            convertView = inflater.inflate(R.layout.course_item, null);
            viewHolder = new ViewHolder();
            viewHolder.image = convertView.findViewById(R.id.image);
            viewHolder.name = convertView.findViewById(R.id.name);
            viewHolder.intro = convertView.findViewById(R.id.intro);
            viewHolder.price = convertView.findViewById(R.id.price);
            viewHolder.oldPrice = convertView.findViewById(R.id.oldPrice);
            viewHolder.studyPerson = convertView.findViewById(R.id.studyPerson);
            convertView.setTag(viewHolder);
        } else {
            viewHolder = (ViewHolder) convertView.getTag();
        }

        Course course = data.get(position);
        viewHolder.image.setImageResource(course.getImage());
        viewHolder.name.setText(course.getName());
        viewHolder.price.setText("¥" + course.getPrice());
        viewHolder.oldPrice.setText("¥" + course.getOldPrice());
        viewHolder.studyPerson.setText(course.getStudyPerson() + "人已參與學習");

        return convertView;
    }

    class ViewHolder {
        public ImageView image;
        public TextView name;
        public TextView intro;
        public TextView price;
        public TextView oldPrice;
        public TextView studyPerson;
    }

}

CourseActivity.java

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.ListView;
import java.util.ArrayList;
import java.util.List;
public class CourseActivity extends AppCompatActivity {

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

        //構建數據
        List<Course> data = new ArrayList<>();
        //public Course(int image, String name, String intro, double price, double oldPrice, int studyPerson) {
        Course course = new Course(R.drawable.study1, "大自然", "大自然很神祕,充滿新奇", 30, 60, 1000);
        data.add(course);
        Course course1 = new Course(R.drawable.study2, "大自然", "大自然很神祕,充滿新奇", 30, 60, 1000);
        data.add(course1);
        Course course2 = new Course(R.drawable.study3, "大自然", "大自然很神祕,充滿新奇", 30, 60, 1000);
        data.add(course2);

        //初始化ListView
        ListView listView = findViewById(R.id.listView);
        CourseAdapter adapter = new CourseAdapter(data, this);
        listView.setAdapter(adapter);

    }
    
}

效果圖:

在這裏插入圖片描述

part3:

MainActivity.java

import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
public class MainActivity extends AppCompatActivity {

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

    /**
     * 演示引導圖
     * @param view
     */
    public void showGuidance(View view) { //參數是固定
        Intent intent = new Intent(MainActivity.this, GuidanceActivity.class);
        startActivity(intent);
    }

    /**
     * 演示ListView
     * @param view
     */
    public void showListView(View view) { //參數是固定
        Intent intent = new Intent(MainActivity.this, CourseActivity.class);
        startActivity(intent);
    }

    /**
     * 演示GridView
     * @param view
     */
    public void showGridView(View view) { //參數是固定
        Intent intent = new Intent(MainActivity.this, GridViewDemoActivity.class);
        startActivity(intent);
    }

}

activity_grid_view_demo.xml

<?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">

    <GridView
        android:id="@+id/gridView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:numColumns="2"
        android:background="#000000"
        android:minWidth="180dp"
        android:verticalSpacing="20dp"
        android:horizontalSpacing="20dp"/>

</RelativeLayout>

效果圖:

在這裏插入圖片描述

Demo.java

public class Demo {

    private int image;
    private String name;
    private String intro;
    private double price;

    public Demo(int image, String name, String intro, double price) {
        this.image = image;
        this.name = name;
        this.intro = intro;
        this.price = price;
    }

    public int getImage() {
        return image;
    }

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

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getIntro() {
        return intro;
    }

    public void setIntro(String intro) {
        this.intro = intro;
    }

    public double getPrice() {
        return price;
    }

    public void setPrice(double price) {
        this.price = price;
    }

}

guidance_button_shape.xml

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

    <corners android:radius="10dp"></corners>
    <solid android:color="#FFFFFF"></solid>

</shape>

效果圖:

在這裏插入圖片描述

demo_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="180dp"
    android:layout_height="250dp"
    android:background="@drawable/demo_shape">

    <ImageView
        android:id="@+id/image"
        android:layout_width="140dp"
        android:layout_height="140dp"
        android:src="@drawable/sofa"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="10dp"/>

    <TextView
        android:id="@+id/name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="懶人沙發"
        android:textSize="14sp"
        android:textColor="#222222"
        android:textStyle="bold"
        android:layout_below="@id/image"
        android:layout_marginTop="10dp"
        android:layout_alignLeft="@id/image"/>

    <TextView
        android:id="@+id/intro"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="單人沙發/扶手椅, 威索爾 深灰色, 卡布薩 深灰色"
        android:layout_below="@id/name"
        android:layout_marginTop="5dp"
        android:layout_alignLeft="@id/name"
        android:textSize="12sp"
        android:textColor="#BFBFBF"/>

    <TextView
        android:id="@+id/price"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="¥699"
        android:textSize="16sp"
        android:textColor="#404040"
        android:layout_below="@id/intro"
        android:layout_marginTop="5dp"
        android:layout_alignLeft="@id/intro"/>

    <ImageButton
        android:id="@+id/cartButton"
        android:layout_width="24dp"
        android:layout_height="24dp"
        android:src="@drawable/bag"
        android:layout_alignBottom="@id/price"
        android:layout_alignParentRight="true"
        android:layout_marginRight="10dp"/>

</RelativeLayout>

效果圖:

在這裏插入圖片描述

sofa.png

在這裏插入圖片描述

bag.png

在這裏插入圖片描述

DemoAdapter.java

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.ImageView;
import android.widget.TextView;
import java.util.List;
public class DemoAdapter extends BaseAdapter {

    private List<Demo> data;
    private Context context;
    private LayoutInflater inflater;

    public DemoAdapter(List<Demo> data, Context context) {
        this.data = data;
        this.context = context;
        this.inflater = LayoutInflater.from(context);
    }

    @Override
    public int getCount() {
        return data.size();
    }

    @Override
    public Object getItem(int position) {
        return data.get(position);
    }

    @Override
    public long getItemId(int position) {
        return position;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        ViewHolder viewHolder;
        if (convertView == null) {
            convertView = inflater.inflate(R.layout.demo_item, null);
            viewHolder = new ViewHolder();
            viewHolder.image = convertView.findViewById(R.id.image);
            viewHolder.name = convertView.findViewById(R.id.name);
            viewHolder.intro = convertView.findViewById(R.id.intro);
            viewHolder.price = convertView.findViewById(R.id.price);
            convertView.setTag(viewHolder);
        } else {
            viewHolder = (ViewHolder) convertView.getTag();
        }

        Demo demo = data.get(position);
        viewHolder.image.setImageResource(demo.getImage());
        viewHolder.name.setText(demo.getName());
        viewHolder.intro.setText(demo.getIntro());
        viewHolder.price.setText("¥" + demo.getPrice());

        return convertView;
    }

    class ViewHolder {
        public ImageView image;
        public TextView name;
        public TextView intro;
        public TextView price;
    }

}

GridViewDemoActivity.java

import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.GridView;
import java.util.ArrayList;
import java.util.List;
public class GridViewDemoActivity extends AppCompatActivity {

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

        //構建數據
        List<Demo> data = new ArrayList<>();
        //public Demo(int image, String name, String intro, double price) {
        Demo demo = new Demo(R.drawable.sofa, "懶人沙發", "專門爲懶人定製的一款非常舒服的沙發", 200);
        data.add(demo);
        data.add(demo);
        data.add(demo);
        data.add(demo);
        data.add(demo);

        //初始化GridView
        GridView gridView = findViewById(R.id.gridView);
        DemoAdapter adapter = new DemoAdapter(data, this);
        gridView.setAdapter(adapter);
        
    }

}

效果圖:

在這裏插入圖片描述

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章