输入框上的Magnifier

最新推荐文章于 2023-03-24 16:15:43 发布

车机开拓者

最新推荐文章于 2023-03-24 16:15:43 发布

阅读量597

点赞数

分类专栏： Android 文章标签： android kotlin 开发语言

本文链接：https://blog.csdn.net/ZhanPengLu/article/details/126879834

版权

Android 专栏收录该内容

3 篇文章 0 订阅

订阅专栏

本文介绍了如何在Android应用中实现搜索框的放大镜效果，利用Android API28及以上版本支持的Magnifier组件，通过简单的代码实现。在项目中遇到某些同学过度设计的情况，但最终决定遵循一致性原则，记录此实现方式以便后续参考。

摘要由CSDN通过智能技术生成

背景：

因为在项目上，多个模块的相似部分要确保体感一致，然而在相关的PRD上，大家基本都是一致，可是扛不住有些同学“卷人不悔”的操作，硬生生在搜索框上搞了个放大镜的效果，虽然只是一个一看就知道是用当前框架功能做出来的，但也有一种被强上的感觉。

其实一别两宽，各自安好多好，非要整这些花里胡哨的，不过后续产品肯定会要求一致的，所以记录一下，到时候直接抄作业吧。

Magnifier

Magnifier在 API28 之后已经被支持了，也就是Android9，我们的高P，刚好要跑的项目系统版本也是Android9，所以妥妥的使用系统提供的组件就可以了。

官网链接来一个：

https://developer.android.com/guide/topics/text/magnifier?hl=zh-cn#kotlin

实操

其实只是一个很简单的控件调用，就不多解释了，里面的原理和做法有时间再去琢磨琢磨。

贴代码和效果如下：

var magnifier: Magnifier? = null
@RequiresApi(Build.VERSION_CODES.P)
@SuppressLint("ClickableViewAccessibility")
override fun onCreate(savedInstanceState: Bundle?) {
  super.onCreate(savedInstanceState)
  mBinding = DataBindingUtil.setContentView(this,R.layout.activity_main)
  mBinding.lifecycleOwner = this
  setContentView(mBinding.root)
  
  mBinding.editText.setOnTouchListener { view, event ->
    when (event.actionMasked) {
      MotionEvent.ACTION_DOWN, MotionEvent.ACTION_MOVE -> {
        val viewPosition = IntArray(2)
        view.getLocationOnScreen(viewPosition)
        magnifier!!.show(event.rawX - viewPosition[0], event.rawY - viewPosition[1])
      }
      MotionEvent.ACTION_CANCEL, MotionEvent.ACTION_UP -> {
        magnifier!!.dismiss()
      }
    }
    true
  }
  magnifier = Magnifier(mBinding.editText)
}

妥妥的官网代码全复制，不过看了一下效果，满足需求了，如果在细节上还有什么调整，估计就要好好看看代码在瞅瞅。

效果图：