Android开发中怎么实现一个长按将文章生成图片的功能

这篇文章将为大家详细讲解有关Android开发中怎么实现一个长按将文章生成图片的功能，文章内容质量较高，因此小编分享给大家做个参考，希望大家阅读完这篇文章后对相关知识有一定的了解。

创新互联致力于互联网网站建设与网站营销，提供成都做网站、成都网站设计、网站开发、seo优化、网站排名、互联网营销、重庆小程序开发、公众号商城、等建站开发，创新互联网站建设策划专家，为不同类型的客户提供良好的互联网应用定制解决方案，帮助客户在新的全球化互联网环境中保持优势。

长按菜单实现

WebView可以如下实现：

mWebView.setOnCreateContextMenuListener(new View.OnCreateContextMenuListener() {
      @Override
      public void onCreateContextMenu(ContextMenu menu, View v, ContextMenu.ContextMenuInfo menuInfo) {
        genImg.setVisibility(View.VISIBLE);
        T.showSToast(mContext, "再次点击文章可隐藏图片分享");
      }
    });
    // 点击隐藏底部按钮
    mWebView.setOnTouchListener(new View.OnTouchListener() {
      @Override
      public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
          case MotionEvent.ACTION_DOWN:
            lastTime = SystemClock.uptimeMillis();
            break;
          case MotionEvent.ACTION_UP:
            if (SystemClock.uptimeMillis() - lastTime < 300) {
              genImg.setVisibility(View.GONE);
            }
            break;
        }
        return false;
      }
    });

这里通过监听WebView的ContextMenu 监听何时显示底部按钮；同时在onTouch方法中隐藏底部按钮。

genImg.setOnClickListener(new View.OnClickListener() {
      @Override
      public void onClick(View v) {
        genImg.setVisibility(View.INVISIBLE);
        Intent intent = new Intent(FakeJianShuActivity.this, GenScreenShotActivity.class);
        intent.putExtra("data", mHtmlBean);
        startActivity(intent);
      }
    });

点击底部的Button就会跳转到生成长图的界面，同时将之前获取到的HTMLBean对象传递过去。

长图效果实现

这里首先说一下实现思路（思路来源于 此 ）。

•首先通过WebView加载一个本地的Html页面，这个页面包含一些固定，定义了一些标签。然后根据传递过来的mHtmlBean 对象中的信息，通过执行JavaScript动态的替换静态HTML页面中的内容；

•关于黑白两种风格的实现，同样是WebView执行Js，动态替换HTML中CSS 样式，修改WebView的背景色呈现出两种不同的UI 效果。

•通过WebView的capturePicture 和Canvas 可以生成出当前WebView的Bitmap对象，有了这个Bitmap就可以图片保存的功能了。

好了，下面就通过代码分别实现上述步骤。

Html 页面

  





    function changeContent(content) {
      document.getElementById('content').innerHTML = content;
    }

这个HTML页面的内容很简单，在整个文档左上角放置了一个小角标，就是简书APP生成长图时的那个mark.

同时定义了一个JavaScript 方法，功能也很简单，就是用传递的参数content替换article标签中的文档内容。

自定义WebView

为了方便，我们自定义WebView，这里看一下核心逻辑：

public class FakeWebView extends WebView {
  private boolean isFirstLoad = false;
  public void loadData(HtmlBean bean) {
    assembleData(bean);
    if (Build.VERSION.SDK_INT >= 21) {
      isFirstLoad = true;
      webView.setWebChromeClient(new WebChromeClient() {
        @Override
        public void onProgressChanged(WebView view, int newProgress) {
          if (newProgress == 100) {
            if (isFirstLoad) {
              isFirstLoad = false;
              Log.e("TAG", "onProgressChanged");
              updateView();
            }
          }
        }
      });
    } else {
      isFirstLoad = true;
      webView.setVisibility(View.INVISIBLE);
      webView.setWebChromeClient(new WebChromeClient() {
        @Override
        public void onProgressChanged(WebView view, int newProgress) {
          if (newProgress == 100) {
            updateView();
            if (!isFirstLoad)
              webView.setVisibility(View.VISIBLE);
          }
        }
      });
    }
    webView.loadUrl("file:///android_asset/JianShu.html");
  }
  private void assembleData(HtmlBean bean) {
    final String data = bean.getContent();
    final String title = bean.getTitle();
    final String username = bean.getUsername();
    final String publishTime = bean.getPublishTime();
    String Title = "
" + title + "
";
    String Footer = "
" + username + "
" + publishTime + "
";
    content = Title + data + Footer;
  }
  public void updateView() {
    if (mode == MODE_DAY) {
      webView.setBackgroundColor(Color.WHITE);
    } else {
      webView.setBackgroundColor(Color.parseColor("#263238"));
      content = "" + content + "