2017-04-15 77 views
0

我對編碼和應用程​​序開發(近一個月)相當新,所以請耐心等待。我正在研究使用條碼掃描插件的應用程序(根據需要定製)。錯誤的相機覆蓋尺寸的設備旋轉

在應用程序的主視圖(第一個窗口)中,我有一個塊,點擊後會觸發Barcode插件的掃描()。這將打開一個掃描儀的精確尺寸作爲主視圖的塊。但是,如果我旋轉設備,條碼掃描儀視圖的尺寸就會變得不合時宜。

有沒有一種方法可以調整/更改條形碼掃描儀視圖的x,y,w,h值,以便將其與主視圖中的應用程序塊對齊?

當點擊我的應用程序的主視圖掃描模塊,該掃描儀被打開的覆蓋與自定義按鈕:

Image

當旋轉設備,然後點擊掃描塊(綠色塊上應用程序的主視圖),這是它的外觀:

Image

角碼傳遞尺寸上的應用程序的主視圖中的綠色掃描塊:

.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:

實現ZxingScannerView
@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); 
     } 
    }); 
} 

我的片段類:

@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; 
} 

回答

0

我建議你使用鎖定您的位置屏幕方向景觀。所以每次旋轉手機時它都會改變位置。

+0

感謝您的回覆。但是如果我鎖定了位置,應用程序總是以橫向模式打開,即使是在旋轉模式下,我也不想要。我希望掃描儀覆蓋層的尺寸精確地適用於橫向和縱向模式。 – spinach