1.在res的drawable中放入背景图:bg.png, welcome.png, btn_normal.xml ,btn_pressed.xml,btn_selector.xml
btn_normal.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- 圆角的半径 -->
<corners android:radius="20dp"/>
<!-- 填充颜色 -->
<solid android:color="#05DEDF"/>
</shape>
btn_pressed.xml
<?xml version="1.0" encoding="utf-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<!-- 圆角的半径 -->
<corners android:radius="10dp"/>
<!-- 填充颜色 -->
<solid android:color="#0662f5"/>
</shape>
btn_selector.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!-- 正常状态 -->
<item android:drawable="@drawable/btn_normal" android:state_pressed="false"/>
<!-- 按下状态 -->
<item android:drawable="@drawable/btn_pressed" android:state_pressed="true"/>
</selector>
2. AndroidMainfirst.xml中配置网络访问权限:
Permissions->Add->Uses Permission->android.permission.INTERNET
3.添加MainActivity和WelcomeActivity;
activity_welcome.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:background="@drawable/welcome"
tools:context=".WelcomeActivity" >
<TextView
android:id="@+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#ffffff"
android:layout_alignParentRight="true"
android:layout_margin="30dp"
/>
</RelativeLayout>
activity_main.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:background="@drawable/bg"
tools:context=".MainActivity" >
<WebView
android:id="@+id/webView"
android:layout_width="420dp"
android:layout_height="250dp"
android:layout_centerHorizontal="true"
android:layout_marginTop="200dp" />
<LinearLayout
android:id="@+id/message"
android:layout_width="320dp"
android:layout_height="150dp"
android:layout_below="@id/webView"
android:layout_centerHorizontal="true"
android:layout_marginTop="20dp"
android:orientation="horizontal"
>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="150dp"
android:orientation="vertical"
>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="温度:"
android:textSize="20dp"
android:textColor="#ffffff"
android:layout_weight="1"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="湿度:"
android:textSize="20dp"
android:textColor="#ffffff"
android:layout_weight="1"
/>
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="火警:"
android:textSize="20dp"
android:textColor="#ffffff"
android:layout_weight="1"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="150dp"
android:orientation="vertical"
>
<TextView
android:id="@+id/temp"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="0°C"
android:textSize="20dp"
android:textColor="#ffffff"
android:layout_weight="1"
/>
<TextView
android:id="@+id/hum"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="0%rh"
android:textSize="20dp"
android:textColor="#ffffff"
android:layout_weight="1"
/>
<TextView
android:id="@+id/fire"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="fire watching..."
android:textSize="20dp"
android:textColor="#ffffff"
android:layout_weight="1"
/>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:layout_width="420dp"
android:layout_height="200dp"
android:layout_below="@id/message"
android:layout_centerHorizontal="true"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:orientation="horizontal" >
<Button
android:id="@+id/bo"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="开浴室灯"
android:onClick="btnSendMessage"
/>
<Button
android:id="@+id/lo"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="开卧室灯"
android:onClick="btnSendMessage"
/>
<Button
android:id="@+id/ro"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="开餐厅灯"
android:onClick="btnSendMessage"
/>
<Button
android:id="@+id/uo"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="开楼梯灯"
android:onClick="btnSendMessage"
/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:orientation="horizontal" >
<Button
android:id="@+id/bc"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="关浴室灯"
android:onClick="btnSendMessage"
/>
<Button
android:id="@+id/lc"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="关卧室灯"
android:onClick="btnSendMessage"
/>
<Button
android:id="@+id/rc"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="关餐厅灯"
android:onClick="btnSendMessage"
/>
<Button
android:id="@+id/uc"
android:layout_width="0dp"
android:layout_height="80dp"
android:layout_weight="1"
android:background="@drawable/btn_selector"
android:text="关楼梯灯"
android:onClick="btnSendMessage"
/>
</LinearLayout>
</LinearLayout>
</RelativeLayout>
4.设置启动页面为WelcomeActivity:
在AndroidMainfirst.xml中剪切MainActivity的 <intent-filter> ... </intent-filter>放在WelcomeActivity中:
5.WelcomeActivity.java中设置倒计时并跳转页面:
import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.widget.TextView;
public class WelcomeActivity extends Activity {
TextView textView;
Handler h;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_welcome);
textView =(TextView)findViewById(R.id.text);
h = new Handler(){
public void handleMessage(Message msg){
super.handleMessage(msg);
textView.setText(msg.what+"s");
}
};
new Thread(new Runnable() {
@Override
public void run() {
// TODO Auto-generated method stub
int i;
for(i=3;i>0;i--){
Message msg = new Message();
msg.what =i;
h.sendMessage(msg);
try {
Thread.sleep(1000);
} catch (InterruptedException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
Intent intent = new Intent(WelcomeActivity.this,MainActivity.class);
startActivity(intent);
}
}).start();
}
}
6.MainActivity.java中设置点击函数,客户端代码和webView:
import java.io.IOException;
import java.io.InputStream;
import java.io.OutputStream;
import java.net.Socket;
import android.app.Activity;
import android.os.Bundle;
import android.os.Handler;
import android.os.Message;
import android.view.View;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.TextView;
public class MainActivity extends Activity {
Socket client;
Handler h;
TextView textView;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
WebView webView = (WebView) findViewById(R.id.webView);
webView.loadUrl("http://192.168.1.3:8080/?action=stream");
webView.setWebViewClient(new WebViewClient());
h = new Handler() {
// 区分事件的类型
public void handleMessage(Message msg) {
super.handleMessage(msg);
textView=(TextView)findViewById(R.id.temp);
textView.setText(msg.getData().getString("temp"));
textView=(TextView)findViewById(R.id.hum);
textView.setText(msg.getData().getString("hum"));
textView=(TextView)findViewById(R.id.fire);
textView.setText(msg.getData().getString("fire"));
}
};
new Thread(new Runnable() {
@Override
public void run() {
// TODO Auto-generated method stub
try {
client = new Socket("192.168.1.3", 8888);
while (true) {
getMessageHandler();
}
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}).start();
}
public void getMessageHandler() {
// 获取数据接收通道
InputStream in;
try {
in = client.getInputStream();
int len;
Message msg = new Message();
Bundle bundle = new Bundle();
byte[] data = new byte[128];
len = in.read(data);
if (len > 0) {
String string = new String(data, 0, len);
String[] str = string.split(",");
bundle.putString("temp", str[0]);
bundle.putString("hum", str[1]);
bundle.putString("fire", str[2]);
msg.setData(bundle);
h.sendMessage(msg);
}
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
public void sendMessageHandler(final String msg) {
new Thread(new Runnable() {
@Override
public void run() {
// TODO Auto-generated method stub
try {
// 获得数据发送通道
OutputStream out = client.getOutputStream();
out.write(msg.getBytes());
} catch (Exception e) {
// TODO: handle exception
}
}
}).start();
}
public void btnSendMessage(View v) {
switch (v.getId()) {
case R.id.bo:
sendMessageHandler("b o");
break;
case R.id.lo:
sendMessageHandler("l o");
break;
case R.id.ro:
sendMessageHandler("r o");
break;
case R.id.uo:
sendMessageHandler("u o");
break;
case R.id.bc:
sendMessageHandler("b c");
break;
case R.id.lc:
sendMessageHandler("l c");
break;
case R.id.rc:
sendMessageHandler("r c");
break;
case R.id.uc:
sendMessageHandler("u c");
break;
}
}
}
7.结果呈现: