码迷,mamicode.com
首页 > 其他好文 > 详细

碎片实例:简易版本的新闻应用(碎片+列表显示的问题)

时间:2015-05-13 10:34:59      阅读:130      评论:0      收藏:0      [点我收藏+]

标签:


先回顾一下:
1,之前最先是做的一个水果列表的问题
实现是一个水果类fruit.java+主XML文件中是ListView
另外一个单独的水果子项fruit_item.xml
然后是一个适配器Adapter.java
2个xml文件+三个类

2,实现碎片的时候
主xml文件中是Fragment(放碎片),加别的frag的时候带上完整包名就行,所以外加
一个fragment.xml文件(碎片中的具体布局)和一个fragment.java
所以基本的情况是2个xml文件+2个类

再来看下实现效果的大致文件目录
技术分享
android:padding表示给控件的周围加上补白
android:ellipsize 用于设定当文本内容超出控
件宽度时,文本的缩略方式,这里指定成 end 表示在尾部进行缩略。
-----------------------------------------------------------------------------------------------------
3,activity_main.xml:主xml布局,还可以自动判断单双页
2,MainActivity.java:主活动

首先分析做这个需要的类
1,News.java类:基础信息
先考虑左边的标题列表,列表又是放在左边碎片中的,所以
4,news_title_frag.xml文件:放标题列表listview,同时也是碎片类具体小布局
5,news_item.xml:标题列表中的小子项
6,NewsAdapter.java:左边标题列表的适配器
7,NewsTitleFragment.java类:关联左边的碎片
这样左边标题列表算是弄完了

右边
8,news_content.xml:右边的碎片放在哪
9,news_content_frag.xml;右边碎片中具体的小布局
10,NewsContentFragment.java:右边碎片关联的类

此外我们还多加了一个
11,NewsContentActivity.java类作为显示新闻中的内容,只在后面响应单机事件的时候会出发这个活动的启动,跳出一个新的界面

--------------------------------------------------------------------------------------------------------
1,首先来看News.java,很简单没什么说的
public class News {
private String title ;
private String content ;
public String getTitle() {
     return title;
}
public void setTitle(String title ) {
     this.title = title;
}
public String getContent() {
     return content;
}
public void setContent(String content ) {
     this.content = content;
}
}
2,然后来看MainActivity.java,也没什么说的加载主活动,然后设置无标题
3,关于activity_main.xml文件有两个,一个小的,一个大的
<LinearLayout 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"
    tools:context="com.example.fragmentbasepractice.MainActivity" >
    <fragment
        android:id= "@+id/news_title_fragment"
        android:name= "com.example.fragmentbasepractice.NewsTitleFragment"
        android:layout_width= "match_parent"
        android:layout_height= "match_parent"
        />
</LinearLayout>
再看大的
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent" >
    <fragment
        android:id= "@+id/news_title_fragment"
        android:name= "com.example.fragmentbasepractice.NewsTitleFragment"
        android:layout_width= "0dp"
        android:layout_height= "match_parent"
        android:layout_weight= "1" />
    <FrameLayout
        android:id= "@+id/news_content_layout"
        android:layout_width= "0dp"
        android:layout_height= "match_parent"
        android:layout_weight= "3" >
        <fragment
            android:id= "@+id/news_content_fragment"
            android:name= "com.example.fragmentbasepractice.NewsContentFragment"
            android:layout_width= "match_parent"
            android:layout_height= "match_parent"
            />
    </FrameLayout >
</LinearLayout>
4,关于左边标题列表news_title_frag.xml,同时也是一个碎片类具体小布局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent"
    android:orientation="vertical" >
<ListView
    android:id="@+id/news_title_list_view"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent"
    ></ListView >
</LinearLayout>
5,列表中的小子项news_item.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent"
    android:orientation="vertical" >
    <TextView
        android:id= "@+id/news_title"
        android:layout_width= "match_parent"
        android:layout_height= "wrap_content"
        android:singleLine= "true"
        android:ellipsize= "end"
        android:textSize= "18sp"
        android:paddingLeft= "10dp"
        android:paddingRight= "10dp"
        android:paddingTop= "15dp"
        android:paddingBottom= "15dp"
        />
</LinearLayout>
6,这些小子项的适配器NewsAdapter.java
public class NewsAdapter extends ArrayAdapter<News> {
     private int resourecId;

     public NewsAdapter(Context context, int resource, List<News> objects) {
            super( context, resource, objects);
            // TODO Auto-generated constructor stub
            resourecId = resource;
     }
     @Override
     public View getView( int position, View convertView, ViewGroup parent) {
            // TODO Auto-generated method stub
            /* return super.getView(position, convertView, parent); */
           News news = getItem( position);

           View view;
            if ( convertView == null) {
                 view = LayoutInflater.from(getContext()).inflate( resourecId, null);
           } else {
                 view = convertView;
           }
           TextView newTitleText = (TextView) view.findViewById(R.id. news_title);
            newTitleText.setText( news.getTitle());
            return view;
     }

7,即是列表又是碎片布局的xml文件关联的碎片标题类NewsTitleFragment.java

public class NewsTitleFragment extends Fragment implements OnItemClickListener {
     private ListView newsTitleListView;
     private List<News> newsList;
     private NewsAdapter adapter;
     private boolean isTwoPane;

     @Override
     public void onAttach(Activity activity) {
            // TODO Auto-generated method stub
            super.onAttach( activity);
            // 初始化数据
            newsList = getNews();
        adapter=new NewsAdapter( activity, R.layout. news_item, newsList);
     }

     @Override
     public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            // TODO Auto-generated method stub
           View view= inflater.inflate(R.layout. news_title_frag, container, false);
         newsTitleListView=(ListView) view.findViewById(R.id. news_title_list_view);
            newsTitleListView.setAdapter( adapter);
            newsTitleListView.setOnItemClickListener( this);
            return view;
           
     }    
     @Override
     public void onActivityCreated(Bundle savedInstanceState) {
            // TODO Auto-generated method stub
            super.onActivityCreated( savedInstanceState);
            if (getActivity().findViewById(R.id.news_content_layout )!=null) {
                 //可以找到news_content-fragment布局的时候,为双页布局
                 isTwoPane= true;
           } else {
          isTwoPane= false;
           }
     }
     
     /*
      * 初始化数据
      */
     private List<News> getNews() {
            // TODO Auto-generated method stub
           List<News> newsList1 = new ArrayList<News>();
           News new1 = new News();
           News new2 = new News();
            new1.setTitle( "这是标题1");
            new1.setContent( "xxxx是的,这就是标题1的内容xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx" );
            new2.setTitle( "这是标题2");
            new2.setContent( "yyyy是的,这就是标题2的内容yyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyyy" );
            newsList1.add( new1);
            newsList1.add( new2);
            return newsList1;
     }

     @Override
     public void onItemClick(AdapterView<?> parent, View view, int position,
                 long id) {
            // TODO Auto-generated method stub
           News news= newsList.get( position);
            if( isTwoPane){
                 //双页模式,刷新NewsContentFragment中的内容
           NewsContentFragment newsContentFragment=(NewsContentFragment) getFragmentManager().findFragmentById(R.id.news_content_fragment );
            newsContentFragment.refresh( news.getTitle(), news.getContent());
           } else{
           NewsContentActivity. actionStart(getActivity(), news.getTitle(), news.getContent());
           }
     }
}

8,右边的碎片布局news_content.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent"
    android:orientation="vertical" >
    <fragment
        android:id= "@+id/news_content_fragment"
        android:name= "com.example.fragmentbasepractice.NewsContentFragment"
        android:layout_width= "match_parent"
        android:layout_height= "match_parent"
        />
</LinearLayout>

9,右边碎片中的具体小布局news_content_frag.xml
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent">  
<LinearLayout
    android:id="@+id/visibility_layout"
    android:layout_width= "match_parent"
    android:layout_height= "match_parent"
    android:orientation="vertical"
 android:visibility="invisible" >  
    <TextView
        android:id= "@+id/news_title"
        android:layout_width= "match_parent"
        android:layout_height= "wrap_content"
        android:gravity= "center"
        android:padding= "10dp"
        android:textSize= "20sp"
        />
    <ImageView
        android:layout_width= "match_parent"
        android:layout_height= "1dp"
        android:scaleType= "fitXY"
        android:src= "@drawable/spilt_line"
        />  
    <TextView
        android:id= "@+id/news_content"
        android:layout_width= "match_parent"
        android:layout_height= "0dp"
        android:layout_weight= "1"
        android:padding= "15dp"
        android:textSize= "18sp"
        />
    </LinearLayout >
    <ImageView
        android:layout_width= "1dp"
        android:layout_height= "match_parent"
        android:layout_alignParentLeft="true"
        android:scaleType= "fitXY"
        android:src= "@drawable/spilt_line_vertical"
        />

</RelativeLayout>

10,右边碎片具体小布局关联的类NewsContentFragment.java
public class NewsContentFragment extends Fragment {
     private View view;
     @Override
     public View onCreateView(LayoutInflater inflater, ViewGroup container,
                Bundle savedInstanceState) {
            // TODO Auto-generated method stub
            view = inflater.inflate(R.layout. news_content_frag, container, false);
            return view;
     }
     public void refresh(String newsTitle, String newsContent) {
           View visibilityLayout = view.findViewById(R.id. visibility_layout);
            visibilityLayout.setVisibility(View. VISIBLE);
           TextView newsTitleText = (TextView) view.findViewById(R.id. news_title);
           TextView newsContentText = (TextView) view
                     .findViewById(R.id. news_content);
            // 刷新新闻的标题
            newsTitleText.setText( newsTitle);
         //刷新新闻的内容
            newsContentText.setText( newsContent);
     }
}

11,另外我们还加了一个显示新闻中的内容,只在后面响应单机事件的时候会出发这个活动的启动,跳出一个新的界面活动NewsContentActivity.java
public class NewsContentActivity extends Activity {
     public static void actionStart(Context context, String newsTitle,
                String newsContent) {
  Intent intent=new Intent(context, NewsContentActivity. class);
  intent .putExtra("news_title" , newsTitle );
  intent .putExtra("news_content" , newsContent );
     context.startActivity( intent);
     }
     
     @Override
     protected void onCreate(Bundle savedInstanceState) {
            // TODO Auto-generated method stub
            super.onCreate( savedInstanceState);
           requestWindowFeature(Window. FEATURE_NO_TITLE);
           setContentView(R.layout. news_content);
           
            //获取传入的新闻标题
           String newsTitle=getIntent().getStringExtra( "news_title");
            //获取传入的新闻内容
           String newsContent=getIntent().getStringExtra( "news_content");
           
           NewsContentFragment newsContentFragment=(NewsContentFragment) getFragmentManager().findFragmentById(R.id.news_content_fragment );
       //刷新NewsContentFragment界面
            newsContentFragment.refresh( newsTitle, newsContent);
     }
效果如下:
技术分享


技术分享技术分享技术分享技术分享技术分享























碎片实例:简易版本的新闻应用(碎片+列表显示的问题)

标签:

原文地址:http://blog.csdn.net/hll174/article/details/45676381

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!