weex☞扫码(开灯)
2018-12-03 本文已影响45人
小学生的博客
项目需要增加扫码功能
weex playground中已经实现了扫码功能,
weex项目增加的Android依赖中同样也可以看到,
compile 'com.journeyapps:zxing-android-embedded:3.4.0'
weex集成的是 zxing-android-embedded 第三方库
所以不需再做其他引入配置,直接使用
该如何使用,其实简单,就是原生封装module,前端进行调用。(这个参考了其他大佬的代码)
Android端增加ScanModule
import com.google.zxing.integration.android.IntentIntegrator;
import com.nes.app.manufacturer.WXPageActivity;
import com.taobao.weex.annotation.JSMethod;
import com.taobao.weex.bridge.JSCallback;
import com.taobao.weex.common.WXModule;
public class ScanModule extends WXModule {
@JSMethod(uiThread = true)
public void scanCode(JSCallback callback) {
WXPageActivity act=(WXPageActivity)mWXSDKInstance.getContext();
act.setOnScanFinishCallback(callback);
IntentIntegrator integrator = new IntentIntegrator(act);
integrator.initiateScan();
}
}
在WXPageActivity中添加方法
//声明一个 jscallback 来接收扫描的结果
private JSCallback onScanFinishCallback = null;
//新增一个set方法
public void setOnScanFinishCallback(JSCallback callback) {
this.onScanFinishCallback = callback;
}
.....
// Put up our own UI for how to handle the decoded contents.
private void handleDecodeInternally(String code) {
if (!TextUtils.isEmpty(code)) {
Uri uri = Uri.parse(code);
if (uri.getQueryParameterNames().contains("bundle")) {
...
} else if (uri.getQueryParameterNames().contains("_wx_devtool")) {
...
} else if (code.contains("_wx_debug")) {
...
} else {
//新增自定义处理代码
if (this.onScanFinishCallback != null) {
Map data2 = new HashMap();
data2.put("result", true);
data2.put("data", code);
this.onScanFinishCallback.invokeAndKeepAlive(data2);
}else {
Toast.makeText(this, code, Toast.LENGTH_SHORT).show();
Intent intent = new Intent(Constants.ACTION_OPEN_URL);
intent.setPackage(getPackageName());
intent.setData(Uri.parse(code));
startActivity(intent);
}
}
}
}
最后在WXApplication中注册自己的module
WXSDKEngine.registerModule("scan", ScanModule.class);
前端就可以调用啦
const scan = weex.requireModule('scan')
... //在方法中直接使用就行了
scan.scanCode(res => {
...
})
后面是如何实现开灯效果,说来也不算难,就是自定义布局嘛。直接修改上面的scanModule
public void scanCode(JSCallback callback) {
WXPageActivity act=(WXPageActivity)mWXSDKInstance.getContext();
act.setOnScanFinishCallback(callback);
// IntentIntegrator integrator = new IntentIntegrator(act);
// integrator.initiateScan();
IntentIntegrator intentIntegrator = new IntentIntegrator(act);
intentIntegrator
.setDesiredBarcodeFormats(IntentIntegrator.ALL_CODE_TYPES)
.setPrompt("将二维码/条码放入框内,即可自动扫描")//写那句提示的话
.setOrientationLocked(false)//扫描方向固定
.setCaptureActivity(ScanActivity.class) // 设置自定义的activity
.initiateScan(); // 初始化扫描
}
创建ScanActivity (记得在AndroidManifest.xml中添加该class)
public class ScanActivity extends AppCompatActivity implements View.OnClickListener {
DecoratedBarcodeView dbvCustom;
Button switchLight;
TextView switchText;
private CaptureManager captureManager;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.acitivity_scan);
switchLight = findViewById(R.id.switch_light);
switchText = findViewById(R.id.switch_text);
dbvCustom = findViewById(R.id.dbv_custom);
dbvCustom.setOnClickListener(this);
switchLight.setOnClickListener(this);
// 如果没有闪光灯功能,就去掉相关按钮
if (!hasFlash()) {
switchLight.setVisibility(View.GONE);
switchText.setVisibility(View.GONE);
}
captureManager = new CaptureManager(this, dbvCustom);
captureManager.initializeFromIntent(getIntent(), savedInstanceState);
captureManager.decode();
}
@Override
protected void onPause() {
super.onPause();
captureManager.onPause();
}
@Override
protected void onResume() {
super.onResume();
captureManager.onResume();
}
@Override
protected void onDestroy() {
super.onDestroy();
captureManager.onDestroy();
}
@Override
public void onSaveInstanceState(Bundle outState, PersistableBundle outPersistentState) {
super.onSaveInstanceState(outState, outPersistentState);
captureManager.onSaveInstanceState(outState);
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
return dbvCustom.onKeyDown(keyCode, event) || super.onKeyDown(keyCode, event);
}
// 判断是否有闪光灯功能
private boolean hasFlash() {
return getApplicationContext().getPackageManager()
.hasSystemFeature(PackageManager.FEATURE_CAMERA_FLASH);
}
private Boolean isOn = false;
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.switch_light:
if (!isOn) {
this.isOn = true;
this.switchText.setText("关闭");
dbvCustom.setTorchOn(); // 打开手电筒
} else {
this.isOn = false;
this.switchText.setText("打开");
dbvCustom.setTorchOff(); // 关闭手电筒
}
break;
}
}
}
布局中增加一个开关灯的按钮,一个文字提示
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:context=".ScanActivity">
<com.journeyapps.barcodescanner.DecoratedBarcodeView
android:id="@+id/dbv_custom"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:zxing_framing_rect_height="200dp"
app:zxing_framing_rect_width="200dp"
app:zxing_preview_scaling_strategy="fitXY"
app:zxing_use_texture_view="true">
<Button
android:id="@+id/switch_light"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:layout_marginBottom="45dp"
android:layout_marginTop="200dp"
android:background="@drawable/switch_track"></Button>
<TextView
android:id="@+id/switch_text"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="center"
android:gravity="center"
android:layout_marginBottom="45dp"
android:textColor="#ffffff"
android:layout_marginTop="240dp"
android:textSize="16sp"
android:text="打开" />
</com.journeyapps.barcodescanner.DecoratedBarcodeView>
</FrameLayout>
ok,简易的扫码开关灯已经实现。这块基本上都是原生的东东。