钛合金：将视图另存为图片库？

Question

所以我目前有一个带有视图 (id="newPhoto") 的窗口，我在其中放置了上一步中的图像。在这个 newPhoto-view 上，我通过 css 放置一个新视图（id="content"），上面有一个图标和一些文本。 然后我想将带有图像的父视图及其上的图标和文本作为新图像保存到 photoGallery。最简单的方法是什么？将所有内容放在一个视图中并保存新视图，还是截取所需部分并保存？ 不能让它工作:(

我的 filterWindow.xml 文件：

<Alloy>
    <Window id="filterWindow">

       <View id="finalImage" /> 
            <View id="selectedPhoto" />
            <View id="counter">
                <ImageView id="weatherIcon" />
                <Label id="label" />
            </View>

        <Button id="filterAndSaveBtn" onClick="filterAndSave">Filter</Button>

    </Window>
</Alloy>

我的 filterWindow.js：

var photo = Alloy.createController('photo').getView();

$.selectedPhoto.add(photo);
$.selectedPhoto.width = appWidth;
$.selectedPhoto.height = appWidth;

$.label.text = "Some text";

function filterAndSave(e) {
    var blob = $.finalImage.toBlob();
    Ti.Media.saveToPhotoGallery(blob,{
        success: function(e){
            alert('Saved image to gallery');
        },
        error: function(e){
            alert("Error trying to save the image.");
        }
    });
}

提前感谢您查看这个！

Answer 1

我在我的一个项目中遇到了类似的问题。我截取了我需要的区域作为新图片。

//This should be put in your filterAndSave method
if (Ti.Platform.osname == "android") {
    var image = $.imageContainer.toImage().media;
} else {
    var image = $.imageContainer.toImage(null, true);
}

//Saving the image if it is needed somewhere else
var f = Titanium.Filesystem.getFile(Titanium.Filesystem.applicationDataDirectory, "finalChallengeImage.jpeg");
f.write(image);
//Save it to the gallery and do what has to be done

您应该看看toImage() 函数的official documentation。根据您使用的平台，它需要不同的参数。

请注意，我不需要将图像保存到图库，因此必须额外完成（尽管您似乎已经知道如何做到这一点）。

Answer 2

好的……找到了。需要将其保存为 png 文件，否则它会将重叠元素的背景设置为白色，尽管它具有较小的高度。但无论如何......保存为png作品。但只在iOS中尝试过。

所以这是最终的工作代码：

filterWindow.xml：

<View id="finalImage">
    <View id="selectedPhoto" />
    <View id="counter">
        <ImageView id="weatherIcon" />
        <Label id="label" />
    </View>
</View>

filterWindow.js：

var photo = Alloy.createController('photo').getView();

// adding the selected photo from the previous step into the first child-View
$.selectedPhoto.add(photo);

$.selectedPhoto.width = appWidth;
$.selectedPhoto.height = appWidth;

$.finalImage.width = appWidth;
$.finalImage.height = appWidth; 

$.label.text = "Some text";

function filterAndSave(e) {
    if (Ti.Platform.osname == "android") {
        var image = $.finalImage.toImage().media;
    } else {
        var image = $.finalImage.toImage(null, true);
    }

    //Saving the image if it is needed somewhere else
    var f = Titanium.Filesystem.getFile(Titanium.Filesystem.applicationDataDirectory, "finalImage.png");
    f.write(image);

    //Save it to the gallery
    Ti.Media.saveToPhotoGallery(image,{
        success: function(e){
            alert('Saved image to gallery');
        },
        error: function(e){
            alert("Error trying to save the image.");
        }
    });
}

再次感谢您，罗宾。