《Android进阶》之第六篇 Fragment 的使用2

最近通过学习,对fragment的使用有了新的认识。

一开始接触android的时候,很是受不了这个fragment,总感觉它把一个简单的事情搞复杂啦,所以每次新建工程的时候总是固执的选择empty Activity

但是后来发现这样写出来的代码移植的时候总是要该来该去,现在开始偏爱带fragment的工程向导

向导默认生成一个JAVA文件,和两个布局文件

MainActivity.JAVA

package com.example.tesf;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem; public class MainActivity extends Activity { @Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main); if (savedInstanceState == null) {
getFragmentManager().beginTransaction()
.add(R.id.container, new PlaceholderFragment())
.commit();
}
} @Override
public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present.
getMenuInflater().inflate(R.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();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
} /**
* A placeholder fragment containing a simple view.
*/
public static class PlaceholderFragment extends Fragment { public PlaceholderFragment() {
} @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
return rootView;
}
} }

布局文件:activity_main.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="com.example.tesf.MainActivity"
tools:ignore="MergeRootFrame" />

另外一个布局文件:fragment_main.xml  这个布局文件就可以自己发挥啦

下面演示一个登录注册的功能:

《Android进阶》之第六篇 Fragment 的使用2

在fragment_main.xml实现登录注册的布局

<?xml version="1.0" encoding="UTF-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fff2f0eb"
android:orientation="vertical" > <RelativeLayout
android:layout_width="fill_parent"
android:layout_height="@dimen/height_top_bar"
android:layout_weight="0"
android:background="@color/common_top_bar_blue" > <TextView
android:id="@+id/ivTitleName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="登录"
android:textColor="#ffffffff"
android:textSize="20.0sp" />
<ImageButton
android:id="@+id/ivTitleBtnLeft1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:background="@drawable/top_icon_back" />
<ImageButton
android:id="@+id/ivTitleBtnLeft2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:visibility="gone"
android:background="@drawable/top_icon_menu" /> <TextView
android:id="@+id/ivTextViewRigh"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:textColor="#ffffffff"
android:textSize="16.0sp"
android:text="忘记密码"
android:clickable="true" /> </RelativeLayout> <ViewFlipper
android:id="@+id/mainFlipper"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
>
<LinearLayout
android:id="@+id/content1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:background="@color/login_background"
android:orientation="vertical" >
<LinearLayout
android:layout_margin="10dp"
android:padding="8dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/white"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:background="@drawable/inputbox_bg">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@drawable/input_phone"
/>
<EditText
android:id="@+id/login_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="6"
android:inputType="phone"
android:background="@null"
android:textSize="15.0sp"
android:hint="手机号">
<requestFocus />
</EditText>
</LinearLayout> <LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:layout_marginTop="15dp"
android:background="@drawable/inputbox_bg">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="@drawable/input_key"
/>
<EditText
android:id="@+id/login_passward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:inputType="textPassword"
android:layout_weight="6"
android:background="@null"
android:textSize="15.0sp"
android:hint="密码"/>
</LinearLayout>
</LinearLayout>
<Button
android:id="@+id/loadBtn"
style="@style/style_common_btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/selector_common_btn"
android:text="登录" /> <TextView
android:id="@+id/regster_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="8dp"
android:clickable="true"
android:textColor="@color/common_top_bar_blue"
android:text="立即注册"
/>
</LinearLayout> <LinearLayout
android:id="@+id/content2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:background="@color/login_background"
android:orientation="vertical" >
<LinearLayout
android:id="@+id/content2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_horizontal"
android:background="@color/login_background"
android:orientation="vertical" >
<LinearLayout
android:layout_margin="10dp"
android:padding="8dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/white"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:background="@drawable/inputbox_bg">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textColor="@color/common_top_bar_blue"
android:text="手机号"
/>
<EditText
android:id="@+id/register_number"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="6"
android:inputType="phone"
android:background="@null"
android:textSize="15.0sp"
android:hint="请输入手机号作为用户名">
<requestFocus />
</EditText>
</LinearLayout>
<ImageView
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/login_background"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:background="@drawable/inputbox_bg">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textColor="@color/common_top_bar_blue"
android:text="设置密码"
/>
<EditText
android:id="@+id/register_passward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="6"
android:inputType="textPassword"
android:background="@null"
android:textSize="15.0sp"
android:hint="请输入至少6位密码"/>
</LinearLayout>
<ImageView
android:layout_margin="10dp"
android:layout_width="match_parent"
android:layout_height="1dp"
android:background="@color/login_background"
/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center_vertical"
android:orientation="horizontal"
android:background="@drawable/inputbox_bg">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:textColor="@color/common_top_bar_blue"
android:text="验证码"
/>
<EditText
android:id="@+id/register_code"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:inputType="number"
android:background="@null"
android:textSize="15.0sp"
android:textColor="@color/login_background"
android:text="0"/>
<Button
android:id="@+id/get_code"
style="@style/style_common_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:layout_margin="5dp"
android:background="@drawable/selector_common_btn"
android:text="获取验证码" />
</LinearLayout>
</LinearLayout>
<Button
android:id="@+id/confirm_button"
style="@style/style_common_btn"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="10dp"
android:background="@drawable/selector_common_btn2"
android:text="确定" />
</LinearLayout> </LinearLayout> </ViewFlipper> </LinearLayout>

新建一个类实现登录注册的逻辑

package com.example.tesf;
import android.app.Fragment;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.view.View.OnClickListener;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageButton;
import android.widget.TextView;
import android.widget.ViewFlipper; public class RegiserLogin extends Fragment{ private ImageButton ib_back;
private ImageButton ib_menu;
private TextView regster_text;//
private TextView ivTitleName;
private TextView ivTextViewRigh;
private ViewFlipper vf;
private Button confirm_button;
private Button load_btn;
private EditText login_number;
private EditText login_passward;
private EditText register_number;
private EditText register_passward;
private EditText register_code; @Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View rootView = inflater.inflate(R.layout.fragment_main, container, false);
initView(rootView);
return rootView;
}
private void initView(View view){
vf = (ViewFlipper) view.findViewById(R.id.mainFlipper);
ib_menu = (ImageButton) view.findViewById(R.id.ivTitleBtnLeft2);
ib_back = (ImageButton) view.findViewById(R.id.ivTitleBtnLeft1); regster_text = (TextView) view.findViewById(R.id.regster_text);
ivTitleName = (TextView) view.findViewById(R.id.ivTitleName); confirm_button = (Button) view.findViewById(R.id.confirm_button);
load_btn = (Button) view.findViewById(R.id.loadBtn); login_number = (EditText) view.findViewById(R.id.login_number);
login_passward = (EditText) view.findViewById(R.id.login_passward);
register_number = (EditText) view.findViewById(R.id.register_number);
register_passward = (EditText) view.findViewById(R.id.register_passward);
register_code = (EditText) view.findViewById(R.id.register_code); ib_back.setOnClickListener(new OnClickListener() { @Override
public void onClick(View v) {
// finish();
}
}); regster_text.setOnClickListener(new OnClickListener() { @Override
public void onClick(View v) {
ib_menu.setVisibility(View.VISIBLE);
ivTitleName.setText("注册新账号");
vf.showNext();
ib_back.setVisibility(View.GONE);
}
}); ib_menu.setOnClickListener(new OnClickListener() { @Override
public void onClick(View v) {
ib_back.setVisibility(View.VISIBLE);
ivTitleName.setText("登录");
vf.showPrevious();
ib_menu.setVisibility(View.GONE); }
}); } }

实现登录注册功能只需要在向导生成的MainActivity里稍加改动就行

if (savedInstanceState == null) {
getFragmentManager().beginTransaction()
.add(R.id.container, new RegiserLogin())
.commit();
}

其实在学习Android的过程中都可以仿照这种模式,在向导生成代码的基础上,自己创建extends Fragment的类,再建一个该类需要用的布局文件。

这样所有的demo都可以在一个工程下完成啦。

上一篇:js转义


下一篇:iOS开发系列--UITableView全面解析