ฉันค่อนข้างใหม่กับการเขียนโค้ดและการพัฒนาแอป (เกือบหนึ่งเดือน) ดังนั้นโปรดอดทนกับฉันด้วย ฉันกำลังทำงานกับแอปที่ใช้ปลั๊กอินสแกนบาร์โค้ด (ปรับแต่งตามความต้องการ)
ในมุมมองหลักของแอป (หน้าต่างแรก) ฉันมีบล็อก ซึ่งเมื่อคลิกจะทริกเกอร์การสแกนของปลั๊กอินบาร์โค้ด () ซึ่งจะเปิดเครื่องสแกนขนาดที่แน่นอนเป็นบล็อกของมุมมองหลัก แต่หากฉันหมุนอุปกรณ์ ขนาดของมุมมองเครื่องสแกนบาร์โค้ดจะยุ่งวุ่นวาย
มีวิธีใดบ้างที่ฉันสามารถปรับ/เปลี่ยนค่า x,y,w,h ของมุมมองเครื่องสแกนบาร์โค้ดเพื่อให้สอดคล้องกับบล็อกของแอปในมุมมองหลัก
เมื่อคลิกบล็อกสแกนในมุมมองหลักของแอปของฉัน เครื่องสแกนนี้จะเปิดขึ้นเป็นโอเวอร์เลย์พร้อมปุ่มแบบกำหนดเอง:
เมื่อหมุนอุปกรณ์และคลิกบล็อกสแกน (บล็อกสีเขียวในมุมมองหลักของแอป) หน้าตาจะเป็นดังนี้:
โค้ดเชิงมุมที่ส่งผ่านมิติของบล็อกสแกนสีเขียวในมุมมองหลักของแอป:
.directive('barcodeScanner', function ($localStorage, _, $window) {
function link(scope, element, attrs){
scope.scanning = false;
scope.paused = false;
//Barcode-Scanning Green Window
var width = $window.innerWidth;
var height = width * 3/4;
if(width > 450){
width = 400;
height = 300;
}
scope.dimensionStyle = {
width: width+"px",
height: height+"px",
"margin-left" : "auto",
"margin-right" : "auto"
}
scope.$on('stop-scanner', function () {
scope.paused=false;
stopScanner();
});
scope.$on('start-scanner', function () {
scope.paused=true;
startScanner();
});
var mH = $window.innerHeight,
mW = $window.innerWidth;
var startBtn = element[0].querySelector('.barcode-start-btn');
function startScanner(){
var rect = startBtn.getBoundingClientRect();
var options = {
wPer : rect.width/mW,
hPer : rect.height/mH,
yPer : rect.top/mH,
xPer : rect.left/mW
}
scope.scanning = true;
cordova.plugins.barcodescanner.scan(function(result) {
scope.$emit('barcode-scanned',result);
},
options
);
}
Barcodescanner.java ของฉันของปลั๊กอินที่ถูกเรียกใช้ให้เปิดเครื่องสแกน:
@Override
public boolean execute(String action, JSONArray args, CallbackContext callbackContext) {
this.callbackContext = callbackContext;
this.requestArgs = args;
if (action.equals(SCAN)) {
// create fragment
if(!hasPermisssion()) {
requestPermissions(0);
} else {
scan(args);
}
} else if(action.equals(STOP)) {
stop(args);
} else {
return false;
}
return true;
}
public void scan(final JSONArray args) {
final CordovaPlugin that = this;
cordova.getThreadPool().execute(new Runnable() {
public void run() {
int maxHeight = webView.getView().getHeight();
int maxWidth = webView.getView().getWidth();
double xPer = 0/360;
double yPer = 82/568;
double hPer = 270/568;
double wPer = 360/360;
// add config as intent extras
if (args.length() > 0) {
JSONObject obj;
for (int i = 0; i < args.length(); i++) {
try {
obj = args.getJSONObject(i);
if(obj.has(X_PER)){
xPer = obj.getDouble(X_PER);
}
if(obj.has(Y_PER)){
yPer = obj.getDouble(Y_PER);
}
if(obj.has(H_PER)){
hPer = obj.getDouble(H_PER);
}
if(obj.has(W_PER)){
wPer = obj.getDouble(W_PER);
}
} catch (JSONException e) {
Log.i("CordovaLog", e.getLocalizedMessage());
continue;
}
}
}
Bundle bundle = new Bundle();
bundle.putDouble("x", maxWidth*xPer);
bundle.putDouble("y", maxHeight*yPer);
bundle.putDouble("w", maxWidth*wPer);
bundle.putDouble("h", maxHeight*hPer);
openCameraPopup(bundle);
}
});
}
คลาสแฟรกเมนต์ของฉันที่ใช้ ZxingScannerView:
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle state) {
if(state == null){
state = this.getArguments();
}
if(state != null) {
x = state.getDouble("x");
y = state.getDouble("y");
w = state.getDouble("w");
h = state.getDouble("h");
}
mScannerView = new ZXingScannerView(getActivity()){
@Override
public void setupCameraPreview(CameraWrapper cameraWrapper) {
super.setupCameraPreview(cameraWrapper);
buttonStop = new Button(getActivity());
buttonStop.setText("STOP");
ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);
this.addView(buttonStop);
buttonStop.setOnClickListener( new OnClickListener() {
@Override
public void onClick(View v) {
mScannerView.stopCamera();
mScannerView.removeAllViews();
}
});
}
};
mScannerView.setZ(10);
mScannerView.setAutoFocus(true);
mScannerView.setFlash(false);
mScannerView.setX((float) x);
mScannerView.setY((float) y);
mScannerView.setLayoutParams(new ViewGroup.LayoutParams((int)w, (int)h));
return mScannerView;
}