中国免费网站申请,锡林浩特市长安网站 建设初步方案,wordpress微信模板,微信号30元一个自动发货前言
RecyclerView 的使用我就不再多说#xff0c;接下来的几篇文章主要说一下 RecyclerView 的实用小功能#xff0c;包括 列表宫格的切换#xff0c;吸顶效果#xff0c;多布局效果等#xff0c;今天这篇文章就来实现一下列表宫格的切换#xff0c;效果如下 一、数据来…前言
RecyclerView 的使用我就不再多说接下来的几篇文章主要说一下 RecyclerView 的实用小功能包括 列表宫格的切换吸顶效果多布局效果等今天这篇文章就来实现一下列表宫格的切换效果如下 一、数据来源
数据来源于知乎日报API采用 okhttpretrofit 组合方式请求获取网络请求没有进行二次封装只是简单请求数据源对于有需求的用户自行进行封装修改。
二、使用步骤
1.引入库 //万能适配器implementation com.github.CymChad:BaseRecyclerViewAdapterHelper:2.9.50//卡片布局implementation androidx.cardview:cardview:1.0.0//图片加载implementation com.github.bumptech.glide:glide:4.9.0//json解析implementation com.alibaba:fastjson:1.2.61//标题栏implementation com.github.goweii:ActionBarEx:3.2.2// 只引入ActionBarEximplementation com.github.goweii.ActionBarEx:actionbarex:3.2.2// 引入ActionBarCommon/Search/Super依赖于ActionBarEximplementation com.github.goweii.ActionBarEx:actionbarex-common:3.2.22.获取数据 使用如下 URL 进行数据请求API 使用的 HTTP Method 均为 GET
https://news-at.zhihu.com/api/3/news/hot响应实例
{recent: [{news_id: 3748552,thumbnail: http://p3.zhimg.com/67/6a/676a8337efec71a100eea6130482091b.jpg,title: 长得漂亮能力出众性格单纯的姑娘为什么会没有男朋友,url: http://daily.zhihu.com/api/2/news/3748552}]
}
根据实例生成实体类 NewsListBean 实现序列换接口 Serializable
public class NewsListBean implements Serializable {private String date;private ListRecent recent;public String getDate() {return date;}public void setDate(String date) {this.date date;}public ListRecent getRecent() {return recent;}public void setRecent(ListRecent recent) {this.recent recent;}public static class Recent implements Serializable {private String news_id;private String thumbnail;private String title;private String url;public String getNews_id() {return news_id;}public void setNews_id(String news_id) {this.news_id news_id;}public String getThumbnail() {return thumbnail;}public void setThumbnail(String thumbnail) {this.thumbnail thumbnail;}public String getTitle() {return title;}public void setTitle(String title) {this.title title;}public String getUrl() {return url;}public void setUrl(String url) {this.url url;}}
}写一个 接口类用来管理 API ,可以单独放在一个文件夹下
public interface ApiUrl {GET(/api/4/news/hot)CallNewsListBean getPic();}3.主要代码
1 activity_main.xml
这里使用了三方库 ActionBarEx 实现了沉浸式标题栏使用了系统的 ProgressBar 实现请求加载框
?xml version1.0 encodingutf-8?
RelativeLayout xmlns:androidhttp://schemas.android.com/apk/res/androidxmlns:apphttp://schemas.android.com/apk/res-autoandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:orientationverticalper.goweii.actionbarex.ActionBarExandroid:idid/abc_main_returnandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:background#14a4fbapp:ab_autoImmersionfalseapp:ab_bottomLineColor#f3f3f3app:ab_bottomLineHeight0dpapp:ab_statusBarColor#00000000app:ab_statusBarModedarkapp:ab_statusBarVisibletrueapp:ab_titleBarHeight50dpapp:ab_titleBarLayoutlayout/top /androidx.recyclerview.widget.RecyclerViewandroid:idid/zh_lvandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:layout_belowid/abc_main_return /ProgressBarandroid:idid/progressbarstylestyle/Base.Widget.AppCompat.ProgressBarandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_centerInParenttrueandroid:visibilitygone /
/RelativeLayout
2 zh_item_layout.xml
列表子布局 ,采用 CardView 卡片布局
?xml version1.0 encodingutf-8?
androidx.cardview.widget.CardView xmlns:androidhttp://schemas.android.com/apk/res/androidxmlns:apphttp://schemas.android.com/apk/res-autoandroid:idid/zh_card_Viewandroid:layout_widthmatch_parentandroid:layout_heightwrap_contentandroid:layout_marginLeftdimen/dp_10android:layout_marginTop10dpandroid:layout_marginRightdimen/dp_10android:layout_marginBottomdimen/dp_10app:cardBackgroundColor#ffffffapp:cardCornerRadius10dpapp:cardElevation10dpapp:cardPreventCornerOverlaptrueapp:cardUseCompatPaddingfalseRelativeLayoutandroid:layout_widthmatch_parentandroid:layout_height120dpRelativeLayoutandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:backgroundcolor/transparentImageViewandroid:idid/news_imageandroid:layout_width70dpandroid:layout_height70dpandroid:layout_centerVerticaltrueandroid:layout_margin10dpandroid:elevation2dpandroid:scaleTypefitXY /TextViewandroid:idid/news_titleandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:layout_centerVerticaltrueandroid:layout_marginStart10dpandroid:layout_marginTop10dpandroid:layout_marginEnd10dpandroid:layout_toEndOfid/news_imageandroid:ellipsizeendandroid:maxEms15android:singleLinetrueandroid:textColorcolor/blackandroid:textSize20sp //RelativeLayout/RelativeLayout/androidx.cardview.widget.CardView
3 zh_grid__item_layout.xml
?xml version1.0 encodingutf-8?
androidx.cardview.widget.CardView xmlns:androidhttp://schemas.android.com/apk/res/androidxmlns:apphttp://schemas.android.com/apk/res-autoandroid:idid/zh_card_Viewandroid:layout_widthmatch_parentandroid:layout_height180dpandroid:layout_marginLeftdimen/dp_10android:layout_marginTop10dpandroid:layout_marginRightdimen/dp_10android:layout_marginBottomdimen/dp_10app:cardBackgroundColor#ffffffapp:cardCornerRadius10dpapp:cardElevation10dpapp:cardPreventCornerOverlaptrueapp:cardUseCompatPaddingfalseLinearLayoutandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:backgroundcolor/transparentandroid:gravitycenterandroid:orientationverticalandroid:paddingdimen/dp_10LinearLayoutandroid:layout_widthmatch_parentandroid:layout_height0dpandroid:layout_weight3ImageViewandroid:idid/news_imageandroid:layout_widthmatch_parentandroid:layout_heightmatch_parentandroid:scaleTypefitXY //LinearLayoutLinearLayoutandroid:layout_widthmatch_parentandroid:layout_height0dpandroid:layout_weight1android:gravitycenterTextViewandroid:idid/news_titleandroid:layout_widthwrap_contentandroid:layout_heightwrap_contentandroid:ellipsizeendandroid:maxEms8android:singleLinetrueandroid:textColorcolor/blackandroid:textSize20sp //LinearLayout/LinearLayout/androidx.cardview.widget.CardView
4 NewsListAdapter 适配器
public class NewsListAdapter extends BaseQuickAdapterNewsListBean.Recent, BaseViewHolder {public NewsListAdapter(int layoutResId, Nullable ListNewsListBean.Recent data) {super(layoutResId, data);}Overrideprotected void convert(NonNull BaseViewHolder helper, NewsListBean.Recent item) {helper.setText(R.id.news_title, item.getTitle());String img item.getThumbnail();ImageView newsImage helper.getView(R.id.news_image);Glide.with(mContext).asBitmap().load(img).diskCacheStrategy(DiskCacheStrategy.ALL).into(newsImage);helper.addOnClickListener(R.id.zh_card_View);}}
5 BaseActivity 基类
public abstract class BaseActivity extends AppCompatActivity {Overrideprotected void onCreate(Nullable Bundle savedInstanceState) {Window window getWindow();// 5.0以上系统状态栏透明if (Build.VERSION.SDK_INT Build.VERSION_CODES.LOLLIPOP) {window.clearFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN| View.SYSTEM_UI_FLAG_LAYOUT_STABLE | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);window.addFlags(WindowManager.LayoutParams.FLAG_DRAWS_SYSTEM_BAR_BACKGROUNDS);window.setStatusBarColor(Color.TRANSPARENT);}if (Build.VERSION.SDK_INT Build.VERSION_CODES.JELLY_BEAN) {if (Build.VERSION.SDK_INT Build.VERSION_CODES.LOLLIPOP) {// 全屏显示隐藏状态栏和导航栏拉出状态栏和导航栏显示一会儿后消失。window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_LAYOUT_STABLE// | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN| View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION// | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION// | View.SYSTEM_UI_FLAG_FULLSCREEN| View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);} else {// 全屏显示隐藏状态栏window.getDecorView().setSystemUiVisibility(View.SYSTEM_UI_FLAG_FULLSCREEN);}}//预防软键盘挡住输入框getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN);//禁止横屏setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);super.onCreate(savedInstanceState);}}6 MainActivity 主要代码
这里主要通过一个 boolean 值 isGrid 来判断是否切换状态来加载不同的布局以及布局管理器来达到实际效果
public class MainActivity extends BaseActivity {private RecyclerView zhLv;private ProgressBar proBar;private NewsListAdapter adapter;private ListNewsListBean.Recent mList new ArrayList();private static final int REQUEST_EXTERNAL_STORAGE 1;private static String[] PERMISSIONS_STORAGE {Manifest.permission.READ_EXTERNAL_STORAGE,Manifest.permission.WRITE_EXTERNAL_STORAGE};private ImageView menuBtn;private LinearLayoutManager layoutManager;private ImageView btnImg;private LinearLayout backLayoput;public static void verifyStoragePermissions(Activity activity) {int permission ActivityCompat.checkSelfPermission(activity,Manifest.permission.WRITE_EXTERNAL_STORAGE);if (permission ! PackageManager.PERMISSION_GRANTED) {ActivityCompat.requestPermissions(activity, PERMISSIONS_STORAGE,REQUEST_EXTERNAL_STORAGE);}}private boolean isGrid false;Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);verifyStoragePermissions(MainActivity.this);initView();initData();menuBtn.setOnClickListener(new View.OnClickListener() {Overridepublic void onClick(View v) {switchLayout();}});}private void switchLayout() {if (isGrid) {layoutManager new LinearLayoutManager(this);adapter new NewsListAdapter(R.layout.zh_item_layout, mList);zhLv.setAdapter(adapter);} else {layoutManager new GridLayoutManager(this, 2);adapter new NewsListAdapter(R.layout.zh_grid__item_layout, mList);zhLv.setAdapter(adapter);}zhLv.setLayoutManager(layoutManager);isGrid !isGrid;}private void initView() {zhLv findViewById(R.id.zh_lv);proBar findViewById(R.id.progressbar);menuBtn findViewById(R.id.btn_main_menu);btnImg findViewById(R.id.btn_main_menu);backLayoput findViewById(R.id.btn_back_layout);backLayoput.setOnClickListener(new View.OnClickListener() {Overridepublic void onClick(View v) {finish();}});layoutManager new LinearLayoutManager(MainActivity.this);zhLv.setLayoutManager(layoutManager);adapter new NewsListAdapter(R.layout.zh_item_layout, mList);zhLv.setAdapter(adapter);}private void initData() {proBar.setVisibility(View.VISIBLE);Retrofit retrofit new Retrofit.Builder().baseUrl(https://news-at.zhihu.com/)//设置数据解析器.addConverterFactory(GsonConverterFactory.create()).build();ApiUrl apiUrl retrofit.create(ApiUrl.class);CallNewsListBean call apiUrl.getPic();call.enqueue(new CallbackNewsListBean() {Overridepublic void onResponse(CallNewsListBean call, ResponseNewsListBean response) {ListNewsListBean.Recent recent response.body().getRecent();if (response.body() ! null recent.size() 0) {try {mList.addAll(recent);adapter.setNewData(mList);proBar.setVisibility(View.GONE);} catch (Exception e) {String message e.getMessage();e.printStackTrace();}}}Overridepublic void onFailure(CallNewsListBean call, Throwable t) {Log.e(mmm, errow t.getMessage());}});}} 总结
一个小小的很实用的功能就完成了下一篇文章会接着实现RecyclerView 吸顶效果后续还会加上列表本地缓存等功能Demo 在此系列文章完结附上不妨点赞收藏哦~
青山不改绿水长流 有缘江湖再见 ~
