本文深入探讨了在Android应用中如何利用布局文件和回调接口在HotFragment中实现热点展示与操作交互。具体包括：1. 热点布局设计，通过线性布局、相对布局等实现图标、文本等元素的排列；2. 利用回调接口实现在不同界面元素间的操作联动，如菜单切换、按钮点击事件等；3. 带刷新栏的ListView的使用，包括数据加载、分页展示及加载状态的处理。文章旨在提供一个完整的示例，帮助开发者理解和实现类似的UI功能。
因为我们将资源内容全部是加载在Fragment中，因此我们现在制作第一个Fragment热点
首先我们观察HotFragment的布局。
可以看出外部布局是一个线性布局LinearLayout vertical垂直分布，然后干货一行通过RelativeLayout实现，菜单icon和编辑icon 可以通过paddingleft和paddingright设置左右，中间干货，嫩草，文字部分是个线性布局
可以通过AS的布局树看的更加清晰:
下面我将HotFragment的布局代码贴出来:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EDE4D6"
android:orientation="vertical"
android:paddingBottom="0dp"
android:paddingTop="0dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@mipmap/top_bar_bg"
>
<ImageView
android:id="@+id/Menu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:paddingBottom="5dp"
android:paddingLeft="15dp"
android:paddingTop="5dp"
android:src="@mipmap/side_icon"/>
<ImageView
android:id="@+id/SendAshamed"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:paddingBottom="5dp"
android:paddingRight="15dp"
android:paddingTop="5dp"
android:src="@mipmap/icon_post_enable" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:background="@mipmap/top_tab_background3"
android:gravity="center_vertical"
android:orientation="horizontal" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="@+id/TopMenuOne"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="@mipmap/top_tab_active"
android:gravity="center"
android:text="干货"
android:textColor="#FFFFFF" />
<TextView
android:id="@+id/TopMenuTwo"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="嫩草"
android:textColor="#815F3D" />
<TextView
android:id="@+id/TopMenuThree"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
android:gravity="center"
android:text="文字"
android:textColor="#815F3D" />
</LinearLayout>
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:id="@+id/load_progressBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal"
android:paddingTop="10dp" >
<ProgressBar
style="@style/myProgressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:visibility="visible" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingLeft="10dp"
android:text="拼命加载中..."
android:textColor="#815F3D"
android:textSize="18sp" />
</LinearLayout>
<TextView
android:id="@+id/HomeNoValue"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="10dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:paddingTop="10dp"
android:text="暂无糗事哦，快快点击右上角做第一个发表糗事的人吧~"
android:textColor="#815F3D"
android:textSize="18sp"
android:visibility="gone" />
<LinearLayout
android:id="@+id/HomeGroup"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#EDE4D6"
android:orientation="vertical"
android:visibility="gone" >
</LinearLayout>
</LinearLayout>HotFragment代码:
public class HotFragment extends Fragment {
private String hotUrl = Model.GANHUO;
private int topMenuFlag = 1;
private HotFragmentCallBack mHotFragmentCallBack;
private View mHotFrageView;
@ViewInject(R.id.Menu)
private ImageView mTopImg;
@ViewInject(R.id.SendAshamed)
private ImageView mSendAshamed;
@ViewInject(R.id.TopMenuOne)
private TextView mTopMenuOne;
@ViewInject(R.id.TopMenuTwo)
private TextView mTopMenuTwo;
@ViewInject(R.id.TopMenuThree)
private TextView mTopMenuThree;
//自定义ListView
private MyListView myListView;
@ViewInject(R.id.HomeGroup)
private LinearLayout mLinearLayout ;
@ViewInject(R.id.load_progressBar)
private LinearLayout load_progressBar;
@ViewInject(R.id.HomeNoValue)
private TextView HomeNoValue;
//自定义Json解析器 private MyJson myJson = new MyJson();
private List<AshamedInfo> list = new ArrayList<AshamedInfo>();
//自定义ListView适配器
private MyListAdapter mAdapter = null;
private Button ListBottem = null;
private int mStart = 0;
private int mEnd = 5;
private String url = null;
private boolean flag = true;
private boolean loadflag = false;
private boolean listBottemFlag = true;
private Context ctx;
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
mHotFrageView=inflater.inflate(R.layout.frame_home, null);
x.view().inject(this,mHotFrageView);
ctx=mHotFrageView.getContext();
initView();
return mHotFrageView;
}
private void initView() {
myListView = new MyListView(ctx);
//因为是动态加载的listView所以要动态设置listview的属性值
myListView.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT,
LinearLayout.LayoutParams.WRAP_CONTENT));
myListView.setDivider(null);
//将listView加载到空白的线性布局中
mLinearLayout.addView(myListView);
createTextColor();
//切换bar的背景
switch (topMenuFlag) {
case 1:
mTopMenuOne.setTextColor(Color.WHITE);
mTopMenuOne.setBackgroundResource(R.mipmap.top_tab_active);
break;
case 2:
mTopMenuTwo.setTextColor(Color.WHITE);
mTopMenuTwo.setBackgroundResource(R.mipmap.top_tab_active);
break;
case 3:
mTopMenuThree.setTextColor(Color.WHITE);
mTopMenuThree.setBackgroundResource(R.mipmap.top_tab_active);
break;
}
ListBottem = new Button(ctx);
ListBottem.setText("点击加载更多");
ListBottem.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
if (flag && listBottemFlag) {
url = hotUrl + "start=" + mStart + "&end=" + mEnd;
// ThreadPoolUtils.execute(new HttpGetThread(hand, url));
listBottemFlag = false;
} else if (!listBottemFlag)
Toast.makeText(ctx, "正在加载中...", Toast.LENGTH_LONG).show();
}
});
mAdapter=new MyListAdapter(ctx,list);
myListView.addFooterView(ListBottem, null, false);
ListBottem.setVisibility(View.GONE);
myListView.setAdapter(mAdapter);
myListView.setOnItemClickListener(new MainListOnItemClickListener());
url = Model.GANHUO + "start=" + mStart + "&end=" + mEnd;
// ThreadPoolUtils.execute(new HttpGetThread(hand, url));
myListView.setonRefreshListener(new MyListView.OnRefreshListener() {
@Override
public void onRefresh() {
if (loadflag == true) {
mStart = 0;
mEnd = 5;
url = hotUrl + "start=" + mStart + "&end=" + mEnd;
ListBottem.setVisibility(View.GONE);
// ThreadPoolUtils.execute(new HttpGetThread(hand, url));
loadflag = false;
} else {
Toast.makeText(ctx, "正在加载中，请勿重复刷新", Toast.LENGTH_LONG).show();
}
}
});
}
private class MainListOnItemClickListener implements AdapterView.OnItemClickListener {
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2,
long arg3) {
/* Intent intent = new Intent(ctx, AshamedDetailActivity.class);
Bundle bund = new Bundle();
bund.putSerializable("AshamedInfo", list.get(arg2 - 1));
intent.putExtra("value", bund);
startActivity(intent); */
}
}
@Event(value={R.id.Menu,R.id.SendAshamed,R.id.TopMenuOne,R.id.TopMenuTwo,R.id.TopMenuThree},type=View.OnClickListener.class)
private void OnClick(View v) {
int mID = v.getId();
switch (mID) {
case R.id.Menu:
mHotFragmentCallBack.callback(R.id.Menu);
break;
case R.id.SendAshamed:
mHotFragmentCallBack.callback(R.id.SendAshamed);
break;
case R.id.TopMenuOne:
createTextColor();
mTopMenuOne.setTextColor(Color.WHITE);
mTopMenuOne.setBackgroundResource(R.mipmap.top_tab_active);
if (topMenuFlag != 1) {
hotUrl = Model.GANHUO;
topMenuFlag = 1;
// createListModel();
}
break;
case R.id.TopMenuTwo:
createTextColor();
mTopMenuTwo.setTextColor(Color.WHITE);
mTopMenuTwo.setBackgroundResource(R.mipmap.top_tab_active);
if (topMenuFlag != 2) {
hotUrl = Model.NENCAO;
topMenuFlag = 2;
//createListModel();
}
break;
case R.id.TopMenuThree:
createTextColor();
mTopMenuThree.setTextColor(Color.WHITE);
mTopMenuThree.setBackgroundResource(R.mipmap.top_tab_active);
if (topMenuFlag != 3) {
hotUrl = Model.WENZI;
topMenuFlag = 3;
// createListModel();
}
break;
default:
break;
}
}
@SuppressWarnings("deprecation")
private void createTextColor() {
Drawable background = new BitmapDrawable();
mTopMenuOne.setTextColor(Color.parseColor("#815F3D"));
mTopMenuTwo.setTextColor(Color.parseColor("#815F3D"));
mTopMenuThree.setTextColor(Color.parseColor("#815F3D"));
mTopMenuOne.setBackgroundDrawable(background);
mTopMenuTwo.setBackgroundDrawable(background);
mTopMenuThree.setBackgroundDrawable(background);
HomeNoValue.setVisibility(View.GONE);
}
public void setCallBack(HotFragmentCallBack mHotFragmentCallBack) {
this.mHotFragmentCallBack = mHotFragmentCallBack;
}
public interface HotFragmentCallBack {
public void callback(int flag);
}
}
有了布局文件之后，我们就应该在HotFragment的OnCreate方法中将其加载出来:
mHotFrageView=inflater.inflate(R.layout.frame_home, null);
因为在HotFragment中我们还要动态的添加ListView所以我们需要获取HotFragment布局的上下文
ctx=mHotFrageView.getContext();
还有些网络请求方面我还没有涉及，因此有些代码并没有，或者被屏蔽。
其中最重要的亮点一个是回调接口:
在HotFragment中声明了接口
public void setCallBack(HotFragmentCallBack mHotFragmentCallBack) {
this.mHotFragmentCallBack = mHotFragmentCallBack;
}
public interface HotFragmentCallBack {
public void callback(int flag);
}然后我们在MainActivity中去实现这个接口:
private class MyHotFragmentCallBack implements HotFragment.HotFragmentCallBack {
@Override
public void callback(int flag) {
switch (flag) {
case R.id.Menu:
MainActivity.this.toggle();
break;
case R.id.SendAshamed:
/* if (Model.MYUSERINFO != null) {
Intent intent = new Intent(MainActivity.this,
UploadActivity.class);
startActivity(intent);
} else {
Intent intent = new Intent(MainActivity.this,
LoginActivity.class);
startActivity(intent);
} */
break;
default:
break;
}
}
}在MainActivty中我们实现了callback这个方法，通过这个回调接口，当我们操作Fragment界面的时候我们就可以在Fragment中调用Activity的方法了。
另一个重点就是带刷新栏的listView。
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
