Android开发--仿腾讯新闻客户端(1)内容列表界面

好久没有更新博客了。
最近由于工作比较忙,再加上忙于社交。导致一直没好好静下来研究Android。
这次给大家分享“仿腾讯新闻内容列表界面”。其实,这段代码已经写了一阵时间了,只是很久没有传上来,这次借好不容易静下来的机会将其贴上来,分享其中一些技术。大家可以给出意见或建议,感谢。

此文只是初期对新闻客户端的布局设计。不管是前端UI还是后台设计,后续会一点一点丰富起来。
文中主要用到的技术:
1、ListView列表
2、各类不同列表项的布局
3、BaseAdapter继承类的应用

众所周知,腾讯新闻客户端主界面是这样的:
腾讯新闻主界面

这次要防的是导航条下面的列表布局,仿后的效果图:

仿腾讯界面

布局原理:可以将整个界面看做一个列表容器(ListView,程序中也确实如此),UI方面有多种布局,每一哥条目不同则布局不同(目前定义了4种新闻条目布局:1、顶部新闻;2、常规新闻;3、3图新闻;4、推广性新闻)。Data方面,每一个条目就是一条新闻对象,不同的新闻对象定义不同, 抽取其相同的共性进行继承。可以理解为:

                    *后台数据对象  ----(驱动)---->UI界面显示*

1、主界面布局 activity_main.xml

<ListView
    android:id="@+id/myList"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:headerDividersEnabled="false"

    xmlns:android="http://schemas.android.com/apk/res/android"></ListView>

就是简单的一个列表View。以后的设计,会将这一块作为一个module,嵌入到主界面中。
其对应的主Activity:

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        ListView listView = (ListView) findViewById(R.id.myList);
        List<NewsItem> newsItemList = getTestData();

        listView.setAdapter(new NewsItemAdapter(this, newsItemList));
    }

    private List<NewsItem> getTestData() {
        List<NewsItem> newsItemList = new ArrayList<>();

        Resources resources = getResources();

        TopNewsItem topNewsItem = new TopNewsItem();
        topNewsItem.setBgImageBitmap(BitmapFactory.decodeResource(resources, R.drawable.laoren));
        topNewsItem.setTitleImageBitmap(BitmapFactory.decodeResource(resources, R.drawable.global_icon_tag_pic));
        topNewsItem.setTitle("老人晚年无人照顾,流泪哭诉");
        topNewsItem.setItemType(ItemType.TOP_ONE_PICTURE);

        NormalNewsItem normalNewsItem = new NormalNewsItem();
        normalNewsItem.setItemType(ItemType.NORMAL_SINGLE_PICTURE);
        normalNewsItem.setTitle("这是一个好新闻");
        normalNewsItem.setCommentNum(99);
        normalNewsItem.setCommentNumImageBitMap(BitmapFactory.decodeResource(resources,R
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值