coordinator使用 WebView加载H5格式
2019-10-08 本文已影响0人
Ad大成
xml
<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:fitsSystemWindows="true"
android:layout_height="match_parent">
<android.support.design.widget.AppBarLayout
android:id="@+id/app_bar"
android:fitsSystemWindows="true"
android:layout_width="match_parent"
android:layout_height="250dp">
<android.support.design.widget.CollapsingToolbarLayout
android:id="@+id/ctl"
app:collapsedTitleGravity="center"
android:fitsSystemWindows="true"
app:contentScrim="@color/colorGray"
android:layout_width="match_parent"
app:layout_scrollFlags="scroll|exitUntilCollapsed"
android:layout_height="match_parent">
<ImageView
android:scaleType="fitXY"
android:id="@+id/iv_ribao_particulars"
android:layout_width="match_parent"
android:layout_height="match_parent" />
<TextView
android:id="@+id/tv_collapsin"
android:textColor="@color/colorWhite"
android:layout_width="wrap_content"
android:layout_gravity="start|bottom"
android:layout_margin="8dp"
android:textSize="13sp"
android:layout_height="wrap_content" />
<android.support.v7.widget.Toolbar
android:id="@+id/view_toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
app:layout_collapseMode="pin"
/>
</android.support.design.widget.CollapsingToolbarLayout>
</android.support.design.widget.AppBarLayout>
<android.support.v4.widget.NestedScrollView
android:id="@+id/nsv_scroller"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:overScrollMode="never"
android:scrollbars="vertical"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<WebView
android:id="@+id/view_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:isScrollContainer="false"
android:overScrollMode="never"
android:scrollbars="vertical"/>
</FrameLayout>
</android.support.v4.widget.NestedScrollView>
<FrameLayout
android:id="@+id/ll_detail_bottom"
android:layout_gravity="bottom"
android:background="@android:color/white"
android:layout_width="match_parent"
android:layout_height="60dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="6dp"
android:orientation="horizontal"
>
<android.support.v4.widget.Space
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_weight="2"/>
<TextView
android:id="@+id/tv_detail_bottom_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/colorBlack"
android:drawableTop="@mipmap/ic_daily_like"
android:drawablePadding="3dp"
android:text="437个赞"/>
<android.support.v4.widget.Space
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_weight="3"/>
<TextView
android:id="@+id/tv_detail_bottom_comment"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/colorBlack"
android:drawableTop="@mipmap/ic_daily_comment"
android:drawablePadding="3dp"
android:text="55条评论"/>
<android.support.v4.widget.Space
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_weight="3"/>
<TextView
android:id="@+id/tv_detail_bottom_share"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="@color/colorBlack"
android:drawableTop="@mipmap/ic_daily_share"
android:drawablePadding="3dp"
android:text="分享"/>
<android.support.v4.widget.Space
android:layout_width="0dp"
android:layout_height="1dp"
android:layout_weight="2"/>
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="0.5dp"
android:layout_gravity="top"
android:background="#e8e8e8"/>
</FrameLayout>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab_like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="30dp"
android:src="@drawable/selector_like"
app:elevation="6dp"
app:pressedTranslationZ="12dp"
app:layout_anchor="@id/app_bar"
app:layout_anchorGravity="bottom|end" />
</android.support.design.widget.CoordinatorLayout>
java 代码
@BindView(R.id.iv_ribao_particulars)
ImageView ivRibaoParticulars;
@BindView(R.id.app_bar)
AppBarLayout appBar;
@BindView(R.id.nsv_scroller)
NestedScrollView nsvScroller;
@BindView(R.id.tv_detail_bottom_like)
TextView tvDetailBottomLike;
@BindView(R.id.tv_detail_bottom_comment)
TextView tvDetailBottomComment;
@BindView(R.id.tv_detail_bottom_share)
TextView tvDetailBottomShare;
@BindView(R.id.ll_detail_bottom)
FrameLayout llDetailBottom;
@BindView(R.id.fab_like)
FloatingActionButton fabLike;
@BindView(R.id.view_main)
WebView viewMain;
@BindView(R.id.tv_collapsin)
TextView tvCollapsin;
@BindView(R.id.ctl)
CollapsingToolbarLayout ctl;
@BindView(R.id.view_toolbar)
Toolbar viewToolbar;
boolean isBottomShow = true;
@Override
public <T> void getHttpResult(T t) {
ZhihuDetailBean t1 = (ZhihuDetailBean) t;
String title = t1.getTitle();
Glide.with(this).load(t1.getImage()).into(ivRibaoParticulars);
ctl.setTitle(title);
tvCollapsin.setText(t1.getGa_prefix());
//折叠前的颜色
ctl.setExpandedTitleColor(getResources().getColor(R.color.colorWhite));
//折叠后的颜色
ctl.setCollapsedTitleTextColor(getResources().getColor(R.color.colorBlack));
WebViewClient webViewClient = new WebViewClient();
viewMain.setWebViewClient(webViewClient);
String htmlData = HtmlUtil.createHtmlData(t1.getBody(), t1.getCss(), t1.getJs());
viewMain.loadData(htmlData, HtmlUtil.MIME_TYPE, HtmlUtil.ENCODING);
}
@Override
protected int getLayout() {
return R.layout.layout_ribao_particulars;
}
@Override
protected void initView() {
}
@Override
protected void initData() {
Intent intent = getIntent();
int id = intent.getIntExtra("id", 0);
String img = intent.getStringExtra("img");
((RibaoPresenter) persenter).getItemDatas(id);
// 设置滑动监听 下拉隐藏 上拉显示
nsvScroller.setOnScrollChangeListener(new NestedScrollView.OnScrollChangeListener() {
@Override
public void onScrollChange(NestedScrollView v, int scrollX, int scrollY, int oldScrollX, int oldScrollY) {
if(scrollY - oldScrollY > 0 && isBottomShow) { //下移隐藏
isBottomShow = false;
llDetailBottom.animate().translationY(llDetailBottom.getHeight());
} else if(scrollY - oldScrollY < 0 && !isBottomShow){ //上移出现
isBottomShow = true;
llDetailBottom.animate().translationY(0);
}
}
});
}
@Override
protected IPersenter initPersenter() {
return new RibaoPresenter();
}
@OnClick({R.id.tv_detail_bottom_like, R.id.tv_detail_bottom_comment, R.id
.tv_detail_bottom_share})
public void onViewClicked(View view) {
switch (view.getId()) {
case R.id.tv_detail_bottom_like:
break;
case R.id.tv_detail_bottom_comment:
break;
case R.id.tv_detail_bottom_share:
break;
}
}
html工具类
public class HtmlUtil
{
//css样式,隐藏header
private static final String HIDE_HEADER_STYLE = "<style>div.headline{display:none;}</style>";
//css style tag,需要格式化
private static final String NEEDED_FORMAT_CSS_TAG = "<link rel=\"stylesheet\" type=\"text/css\" href=\"%s\"/>";
// js script tag,需要格式化
private static final String NEEDED_FORMAT_JS_TAG = "<script src=\"%s\"></script>";
public static final String MIME_TYPE = "text/html; charset=utf-8";
public static final String ENCODING = "utf-8";
private HtmlUtil()
{
}
/**
* 根据css链接生成Link标签
*
* @param url String
* @return String
*/
public static String createCssTag(String url)
{
return String.format(NEEDED_FORMAT_CSS_TAG, url);
}
/**
* 根据多个css链接生成Link标签
*
* @param urls List<String>
* @return String
*/
public static String createCssTag(List<String> urls)
{
final StringBuilder sb = new StringBuilder();
for (String url : urls)
{
sb.append(createCssTag(url));
}
return sb.toString();
}
/**
* 根据js链接生成Script标签
*
* @param url String
* @return String
*/
public static String createJsTag(String url)
{
return String.format(NEEDED_FORMAT_JS_TAG, url);
}
/**
* 根据多个js链接生成Script标签
*
* @param urls List<String>
* @return String
*/
public static String createJsTag(List<String> urls)
{
final StringBuilder sb = new StringBuilder();
for (String url : urls)
{
sb.append(createJsTag(url));
}
return sb.toString();
}
/**
* 根据样式标签,html字符串,js标签
* 生成完整的HTML文档
*/
public static String createHtmlData(String html, List<String> cssList, List<String> jsList)
{
final String css = HtmlUtil.createCssTag(cssList);
final String js = HtmlUtil.createJsTag(jsList);
return css.concat(HIDE_HEADER_STYLE).concat(html).concat(js);
}
}