第Ⅱ期Android菜鸟饭团#Android学习#第十课 活动笔记

xiao_ming

[size=14.6667px]第Ⅱ期Android菜鸟饭团#Android学习#第十课 活动笔记

概要

        本节课主要内容为制作一个篮球计分器，实现加分的的功能；

如何制作一个篮球计分器？

        主要内容：

                        （1）设计一个界面布局；

                              （2）实现其加分、分数归零功能；

        界面制作步骤：

                        1.在content_main.xml中，以相对布局（RelativeLayout）为父布局；

                          主要代码如下：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:app="http://schemas.android.com/apk/res-auto"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    app:layout_behavior="@string/appbar_scrolling_view_behavior"    tools:context="com.gdgny.androidfan.scoringdevice.MainActivity"    tools:showIn="@layout/activity_main"> …… </RelativeLayout>

                        2.在父布局中加入一个线性布局（LinearLayout），在其中添加我们所需要的                ImageView、TextView和Button，用来显示重要信息和加分按钮；

                         主要代码如下：

<LinearLayout    android:layout_weight="1"    androidrientation="vertical"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:id="@+id/linearLayout">    <ImageView        android:src="@drawable/ic_flag_white_48dp_copy"        android:tint="@android:color/holo_red_dark"        android:layout_marginLeft="32dp"        android:layout_width="72dp"        android:layout_height="72dp" />    <TextView        android:id="@+id/scroe_RedTeam_text_view"        android:text="0"        android:textSize="72sp"        android:layout_marginTop="16dp"        android:layout_marginLeft="16dp"        android:layout_gravity="center_horizontal"        android:textColor="@android:color/white"        android:layout_width="wrap_content"        android:layout_height="wrap_content" />    <Button        android:text="+3"        android:textSize="24sp"        android:background="#00000000"        android:textColor="@android:color/black"        android:layout_marginTop="16dp"        android:layout_marginLeft="16dp"        android:layout_gravity="center_horizontal"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        androidnClick="addRedThree"/>    <Button        android:text="+2"        android:textSize="24sp"        android:textColor="@android:color/white"        android:background="#00000000"        android:layout_marginTop="16dp"        android:layout_marginLeft="16dp"        android:layout_gravity="center_horizontal"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        androidnClick="addRedTwo"/>    <Button        android:text="+1"        android:textSize="24sp"        android:textColor="@android:color/white"        android:background="#00000000"        android:layout_marginTop="16dp"        android:layout_marginLeft="16dp"        android:layout_gravity="center_horizontal"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        androidnClick="addRedOne"/> </LinearLayout>

                        3.因为比赛需要，会有两个队伍，所以将第一个相对布局（RelativeLayout）复制后稍作改变；               

                         主要代码如下：

<LinearLayout    android:layout_weight="1"    androidrientation="vertical"    android:gravity="right"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:layout_alignParentTop="true"    android:layout_alignParentEnd="true">    <ImageView        android:src="@drawable/ic_flag_white_48dp_copy"        android:tint="@android:color/holo_blue_dark"        android:layout_marginRight="32dp"        android:layout_width="72dp"        android:layout_height="72dp" />    <TextView        android:id="@+id/scroe_BlueTeam_text_view"        android:text="0"        android:textSize="72sp"        android:layout_marginTop="16dp"        android:layout_marginRight="16dp"        android:layout_gravity="center_horizontal"        android:textColor="@android:color/white"        android:layout_width="wrap_content"        android:layout_height="wrap_content" />    <Button        android:text="+3"        android:textSize="24sp"        android:background="#00000000"        android:layout_marginTop="16dp"        android:layout_marginRight="16dp"        android:layout_gravity="center_horizontal"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        androidnClick="addBlueThree"/>    <Button        android:text="+2"        android:textSize="24sp"        android:textColor="@android:color/white"        android:background="#00000000"        android:layout_marginTop="16dp"        android:layout_marginRight="16dp"        android:layout_gravity="center_horizontal"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        androidnClick="addBlueTwo"/>    <Button        android:text="+1"        android:textSize="24sp"        android:textColor="@android:color/white"        android:background="#00000000"        android:layout_marginTop="16dp"        android:layout_marginRight="16dp"        android:layout_gravity="center_horizontal"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        androidnClick="addBlueOne"/> </LinearLayout>

                        4.同时，可以使用fab（FloatingActionButton）按钮作为分数归零按钮；

                        主要代码如下：

<android.support.design.widget.FloatingActionButton    android:id="@+id/fab"    android:layout_width="wrap_content"    android:layout_height="wrap_content"    android:src="@drawable/ic_settings_backup_restore_white_48dp_copy"    android:clickable="true"    androidnClick="Clean"    android:layout_alignParentBottom="true"    android:layout_centerHorizontal="true" />

效果显示如图：

        到此界面部分的制作已经完毕，下面是功能实现部分；

        功能部分制作步骤：

                        1.当按下加分按钮后，分数显示部分需要发生变化，因此需要将变化的分数传入TextView显示区；

                         主要代码如下：

public void displayRedTeamScore(int score){    TextView scoreView = (TextView) findViewById(R.id.scroe_RedTeam_text_view);    scoreView.setText(String.valueOf(score)); } public void displayBlueTeamScore(int score){    TextView scoreView = (TextView) findViewById(R.id.scroe_BlueTeam_text_view);    scoreView.setText(String.valueOf(score)); }

                        2.同时，当我们按下按钮后需要有相应的操作，因此需要android：onClick这个属性（上述代码已添加，可自行查看）,同时在MainActivity.java中需要相应的调用方法；

                        主要代码如下：

public void addRedThree(View view){    redScore = redScore + 3;    displayRedTeamScore(redScore); } public void addRedTwo(View view){    redScore = redScore + 2;    displayRedTeamScore(redScore); } public void addRedOne(View view){    redScore = redScore + 1;    displayRedTeamScore(redScore); } public void addBlueThree(View view){    blueScore = blueScore + 3;    displayBlueTeamScore(blueScore); } public void addBlueTwo(View view){    blueScore = blueScore + 2;    displayBlueTeamScore(blueScore); } public void addBlueOne(View view){    blueScore = blueScore + 1;    displayBlueTeamScore(blueScore); } public void Clean(View view){     blueScore = 0;     redScore = 0;    displayRedTeamScore(redScore);    displayBlueTeamScore(blueScore); }

        通过以上步骤可成功制作出一个简单的篮球计分器；

        全部代码如下：

MainActivity.java

package com.gdgny.androidfan.scoringdevice; import android.os.Bundle; import android.support.design.widget.FloatingActionButton; import android.support.design.widget.Snackbar; import android.support.v7.app.AppCompatActivity; import android.support.v7.widget.Toolbar; import android.view.View; import android.view.Menu; import android.view.MenuItem; import android.widget.TextView; public class MainActivity extends AppCompatActivity {    int redScore = 0;    int blueScore = 0;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);        setSupportActionBar(toolbar); //        FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab); //        fab.setOnClickListener(new View.OnClickListener() { //            @Override //            public void onClick(View view) { //                Snackbar.make(view, "Replace with your own action", Snackbar.LENGTH_LONG) //                        .setAction("Action", null).show(); //            } //        });    }    @Override    public boolean onCreateOptionsMenu(Menu menu) {        // Inflate the menu; this adds items to the action bar if it is present.        getMenuInflater().inflate(R.menu.menu_main, menu);        return true;    }    @Override    public boolean onOptionsItemSelected(MenuItem item) {        // Handle action bar item clicks here. The action bar will        // automatically handle clicks on the Home/Up button, so long        // as you specify a parent activity in AndroidManifest.xml.        int id = item.getItemId();        //noinspection SimplifiableIfStatement        if (id == R.id.action_settings) {            return true;        }        return super.onOptionsItemSelected(item);    }    public void displayRedTeamScore(int score){        TextView scoreView = (TextView) findViewById(R.id.scroe_RedTeam_text_view);        scoreView.setText(String.valueOf(score));    }    public void displayBlueTeamScore(int score){        TextView scoreView = (TextView) findViewById(R.id.scroe_BlueTeam_text_view);        scoreView.setText(String.valueOf(score));    }    public void addRedThree(View view){        redScore = redScore + 3;        displayRedTeamScore(redScore);    }    public void addRedTwo(View view){        redScore = redScore + 2;        displayRedTeamScore(redScore);    }    public void addRedOne(View view){        redScore = redScore + 1;        displayRedTeamScore(redScore);    }    public void addBlueThree(View view){        blueScore = blueScore + 3;        displayBlueTeamScore(blueScore);    }    public void addBlueTwo(View view){        blueScore = blueScore + 2;        displayBlueTeamScore(blueScore);    }    public void addBlueOne(View view){        blueScore = blueScore + 1;        displayBlueTeamScore(blueScore);    }    public void Clean(View view){         blueScore = 0;         redScore = 0;        displayRedTeamScore(redScore);        displayBlueTeamScore(blueScore);    } }

content_main.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"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    app:layout_behavior="@string/appbar_scrolling_view_behavior"    tools:context="com.gdgny.androidfan.scoringdevice.MainActivity"    tools:showIn="@layout/activity_main">    <ImageView        android:src="@drawable/basketball"        android:scaleType="centerCrop"        android:layout_width="match_parent"        android:layout_height="match_parent" />    <LinearLayout        android:layout_weight="1"        androidrientation="vertical"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/linearLayout">        <ImageView            android:src="@drawable/ic_flag_white_48dp_copy"            android:tint="@android:color/holo_red_dark"            android:layout_marginLeft="32dp"            android:layout_width="72dp"            android:layout_height="72dp" />        <TextView            android:id="@+id/scroe_RedTeam_text_view"            android:text="0"            android:textSize="72sp"            android:layout_marginTop="16dp"            android:layout_marginLeft="16dp"            android:layout_gravity="center_horizontal"            android:textColor="@android:color/white"            android:layout_width="wrap_content"            android:layout_height="wrap_content" />        <Button            android:text="+3"            android:textSize="24sp"            android:background="#00000000"            android:textColor="@android:color/black"            android:layout_marginTop="16dp"            android:layout_marginLeft="16dp"            android:layout_gravity="center_horizontal"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="addRedThree"/>        <Button            android:text="+2"            android:textSize="24sp"            android:textColor="@android:color/white"            android:background="#00000000"            android:layout_marginTop="16dp"            android:layout_marginLeft="16dp"            android:layout_gravity="center_horizontal"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="addRedTwo"/>        <Button            android:text="+1"            android:textSize="24sp"            android:textColor="@android:color/white"            android:background="#00000000"            android:layout_marginTop="16dp"            android:layout_marginLeft="16dp"            android:layout_gravity="center_horizontal"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="addRedOne"/>    </LinearLayout>    <LinearLayout        android:layout_weight="1"        android:orientation="vertical"        android:gravity="right"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:layout_alignParentTop="true"        android:layout_alignParentEnd="true">        <ImageView            android:src="@drawable/ic_flag_white_48dp_copy"            android:tint="@android:color/holo_blue_dark"            android:layout_marginRight="32dp"            android:layout_width="72dp"            android:layout_height="72dp" />        <TextView            android:id="@+id/scroe_BlueTeam_text_view"            android:text="0"            android:textSize="72sp"            android:layout_marginTop="16dp"            android:layout_marginRight="16dp"            android:layout_gravity="center_horizontal"            android:textColor="@android:color/white"            android:layout_width="wrap_content"            android:layout_height="wrap_content" />        <Button            android:text="+3"            android:textSize="24sp"            android:background="#00000000"            android:layout_marginTop="16dp"            android:layout_marginRight="16dp"            android:layout_gravity="center_horizontal"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="addBlueThree"/>        <Button            android:text="+2"            android:textSize="24sp"            android:textColor="@android:color/white"            android:background="#00000000"            android:layout_marginTop="16dp"            android:layout_marginRight="16dp"            android:layout_gravity="center_horizontal"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="addBlueTwo"/>        <Button            android:text="+1"            android:textSize="24sp"            android:textColor="@android:color/white"            android:background="#00000000"            android:layout_marginTop="16dp"            android:layout_marginRight="16dp"            android:layout_gravity="center_horizontal"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:onClick="addBlueOne"/>    </LinearLayout>    <android.support.design.widget.FloatingActionButton        android:id="@+id/fab"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:src="@drawable/ic_settings_backup_restore_white_48dp_copy"        android:clickable="true"        android:onClick="Clean"        android:layout_alignParentBottom="true"        android:layout_centerHorizontal="true" /> </RelativeLayout>

难点解疑：

                在这程序中

                             int redScore = 0;

                                 int blueScore = 0;应当是全局变量而不是局部变量，否则会导致分数无法记忆，不能实现加分功能，按+1按钮就永远是1，不会增加；

每一个技术小白都有一个成为大神的梦想，现在Android菜鸟饭团就给你这个成就梦想的机会。我们提供最新的Android技术教学，只要你又耐心和毅力就一定会在这里有所收获。

Android菜鸟饭团由南阳GDG组织发起，秉承着开放、分享、创新的原则，希望通过GDG社区的力量能够给更多的想要学习Android开发技术的小白们创造一个学习，交流，分享的环境。同往常的GDG活动一样，我们依然是任性的一个子都不要，并且还在周六的分享中提供盒饭和不定期的惊喜小礼物呦~所以快来加入我们吧，为你的大神梦想迈出第一步。

把你的个人信息和申请理由快快发送到android@chuang1.net，前来加入我们吧