Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-26558] iOS: Ti.Media.takeScreenshot is not working

GitHub Issuen/a
TypeBug
PriorityNone
StatusResolved
ResolutionNot Our Bug
Resolution Date2018-11-27T03:21:12.000+0000
Affected Version/sn/a
Fix Version/sn/a
ComponentsiOS
Labelsn/a
ReporterRakhi Mitro
AssigneeVijay Singh
Created2018-11-14T10:47:54.000+0000
Updated2018-11-27T03:21:13.000+0000

Description

Ti.Media.takeScreenshot is not working working properly on iOS. On android, clicking on button its takes a screenshot, saved it to the gallery and displayed it to imageview properly. But on ios we are not getting the same behaviour. *Test Code:*
var win = Ti.UI.createWindow({
        layout: "vertical",
        backgroundColor: "green"
    });

    var button = Ti.UI.createButton({
        title: "Take Pic",
        top: 20,
        width: 200,
        height: 200
    });

  

    win.add(button);



    var imageView = Ti.UI.createImageView({
        width: "100",
        height: "100",
        top: 20
    });
    win.add(imageView);

    button.addEventListener('click', function(e) {

        Ti.Media.takeScreenshot(function(e) {
            Ti.API.info(e.media);
            imageView.image = e.media;
        });


    });




    win.open();
*Test Environment:*
Appcelerator Command-Line Interface, version 7.0.7
Operating System
  Name                        = Mac OS X
  Version                     = 10.13.6
  Architecture                = 64bit
  # CPUs                      = 4
  Memory                      = 8589934592
Node.js
  Node.js Version             = 8.9.1
  npm Version                 = 5.5.1
Titanium CLI
  CLI Version                 = 5.1.1
Titanium SDK
  SDK Version                 = 7.4.1.GA
iOS SDK: 12.0, iOS Simulator: iPhone X

*Test steps:* 1. Create a classic project 2. Run the sample code on simulator 3. Click on button. We get the following:
[INFO] :   rakhiAndroid2/1.0 (7.4.1.f47cf79a83)
[INFO] :   [object TiBlob]
*Console logs and output:* See attachment section for screenshots

Attachments

FileDateSize
Screenshot_20181114-153042.png2018-11-14T10:48:31.000+000047109
Simulator Screen Shot - iPhone X - 2018-11-14 at 16.31.54.png2018-11-14T10:48:31.000+000064446
TestCameraImage.zip2018-11-26T04:56:37.000+000054460

Comments

  1. Vijay Singh 2018-11-15

    [~rmitro] Please add sample test code. Thanks!
  2. Vijay Singh 2018-11-16

    [~rmitro] Its working for me. Check with updated test case -
       var win = Ti.UI.createWindow({
               layout: "vertical",
               backgroundColor: "green"
           });
       
           var button = Ti.UI.createButton({
               title: "Take Pic",
               top: 20,
               width: 100,
               height: 100,
               backgroundColor: 'gray'
           });
       
           win.add(button);
       
           var imageView = Ti.UI.createImageView({
               width: "200",
               height: "200",
               top: 20,
               backgroundColor : 'gray'
           });
           win.add(imageView);
       
           button.addEventListener('click', function(e) {
       
               Ti.Media.takeScreenshot(function(e) {
                   Ti.API.info(e.media);
                   imageView.image = e.media;
               });
           });
           win.open();
  3. Marian Kucharcik 2018-11-16

    Please try to open camera(Ti.Media.showCamera) with overlay and take screenshot with camera interface opened. It takes screenshot with black screen and overlay, not image from camera...
  4. Vijay Singh 2018-11-16

    [~max87] Can you give the reproducible test case please?
  5. Vijay Singh 2018-11-16

    So here is test case -
       
       // -- General UI -- //
       var win = Ti.UI.createWindow({
           backgroundColor: "#fff"
       });
        
       var btn = Ti.UI.createButton({
           title: "Open Camera",
           top: 50
       });
        
       var pic = Ti.UI.createImageView({
           width: 200,
           height: 200,
           bottom: 30,
           backgroundColor: "#ccc"
       });
        
       // -- Overlay UI -- //
        
       var overlay = Ti.UI.createView();
       var takePictureButton = Ti.UI.createButton({
           bottom: 10,
           right: 10,
           title: "Take ScreenShot!",
           backgroundColor: "#ff0",
           width: 150,
           height: 40
       });
       var hideCameraButton = Ti.UI.createButton({
           bottom: 10,
           left: 10,
           title: "Close Camera!",
           backgroundColor: "#00f",
           width: 150,
           height: 40
       });
        
       takePictureButton.addEventListener("click", function() {
           Ti.Media.takeScreenshot(function(e) {
               Ti.API.info(e.media);
               pic.image = e.media;
               Ti.Media.hideCamera();
           });
       });
        
       hideCameraButton.addEventListener("click", function() {
               Ti.Media.hideCamera();
       });
        
       overlay.add(takePictureButton);
       overlay.add(hideCameraButton);
       
       btn.addEventListener("click", function() {
           Ti.Media.showCamera({
               overlay: overlay,
               showControls: false,
               autohide: false,
               success: function(e) {
                   pic.image = e.media;
                   Ti.Media.hideCamera();
               },
               cancel: function(e) {
                   Ti.API.warn("Cancelled: " + JSON.stringify(e));
               },
               error: function(e) {
                   Ti.API.error("Error: " + JSON.stringify(e));
               },
               saveToPhotoGallery: false,
               allowEditing: false, 
               mediaTypes: Ti.Media.MEDIA_TYPE_PHOTO
           });
       });
       win.add(btn);
       win.add(pic);
       win.open();
       
    The code which I can see for taking screenshot is not changed from long. It seems it is expected behaviour for iOS while capturing screenshot. Is it working differently for any previous versions? What is behaviour for android? Will look in this if anything can be done for same.
  6. Vijay Singh 2018-11-16

    [~rmitro] Can you please check the behaviour for android and let me know? Thanks!
  7. Motiur Rahman 2018-11-21

    [~vijaysingh], I tested on Android, it takes a screenshot with white screen and overlay, not image from the camera. Sample code: https://gist.github.com/MotiurRahman/dbe8af54f0b3ba02f0d37bcf4899111c Thanks!
  8. Vijay Singh 2018-11-26

    I have attached a native iOS TestCameraImage app. I tried to capture screenshot in native app as well. It is also behaving in same way. We are using UIImagePickerController to capture image in Titanium. With this it is not possible to capture the camera preview in screenshot. On stack overflow also people have discussed about it [here](https://stackoverflow.com/questions/8996611/ios-capture-screenshot-of-camera-controller) . Thanks!

JSON Source