如何将内存流绑定到asp.net图像控件而不使用图像URL

qqrboqgw  于 2023-08-08  发布在  .NET
关注(0)|答案(3)|浏览(140)

我们有一个新的要求,即在每个记录的结果网格中显示签名图像。目前我们将签名图像以base64格式存储在我们的数据库中。我们能够将base64转换为内存流。我们想知道你的图片控件是否支持从内存流而不是URL绑定图片。

46scxncf

46scxncf1#

您可以将图像保存为base64字符串形式,并使用数据url。下面是一个例子。

<asp:Image runat="server" ID="myImage" />

字符串
后面的代码是

this.myImage.ImageUrl = "data:image/png;base64,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";


前提是你需要知道所有的MIME类型的图像。
参考:data URIs

ha5z0ras

ha5z0ras2#

当然,你可以这样做。
gridview,listview,repeater控件-它们都可以做到这一点。
因此,网格视图的标记:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False">
            <Columns>
                <asp:BoundField DataField="Animal" HeaderText="Animal" ItemStyle-Width="200px"/>

                <asp:TemplateField HeaderText="Picture">
                    <ItemTemplate>
                        <asp:Image ID="Image1" runat="server" 
                            Height="128px" Width="128px"
                            src='<%# "Data:Image/png;base64," + Eval("Image") %>' 
                         />
                    </ItemTemplate>
                </asp:TemplateField>

            </Columns>
        </asp:GridView>

字符串
加载gridview的代码如下:

protected void Page_Load(object sender, System.EventArgs e)
{
    if (System.Web.UI.Page.IsPostBack == false)
        LoadGrid();
}

public void LoadGrid()
{
    using (SqlCommand cmdSQL = new SqlCommand("SELECT Animal, Image from tblAnimals",
                               new SqlConnection(My.Settings.TEST4)))
    {
        cmdSQL.Connection.Open();
        GridView1.DataSource = cmdSQL.ExecuteReader;
        GridView1.DataBind();
    }
}


结果如下:
x1c 0d1x的数据
现在我使用了一个直接的eval表达式--但是您也可以使用gridview(或列表视图)的ItemDataBound事件。
另外,我在上面的代码中硬编码了“mine”类型(假定为.png)。您可能经常需要考虑将文件/mine类型保存为数据库中的一个额外列。但是,如果图片类型都是相同的类型,那么如上所述的表达式中的硬代码将正常工作。
如果这个网格有很多列,那么我倾向于切换到列表视图,因为每个列不需要模板,我发现快速和肮脏的网格视图是可以的,但列表视图更适合调整和大量的定制。诀窍是让Visual Studio生成模板+标记,然后吹出除项模板之外的所有模板。当你这样做的时候,那么疯狂的标记就会减少到“容易”的水平。然后你可以更容易地在控件下降-你没有模板。
所以,上面的listview是这样的:

<asp:ListView ID="ListView1" runat="server">
            <ItemTemplate>
                <tr style="">

                    <td><asp:Label ID="AnimalLabel" runat="server" Text='<%# Eval("Animal") %>' /></td>
                    <td>
                        <asp:Image ID="ImageT1" runat="server" 
                            Height="128px" Width="128px"
                            src='<%# "Data:Image/png;base64," + Eval("Image") %>' 
                         />
                    </td>
                </tr>
            </ItemTemplate>

            <LayoutTemplate>
                <table id="itemPlaceholderContainer" runat="server" border="0" style="">
                    <tr runat="server" style="">
                        <th runat="server" width="200">Animal</th>
                        <th runat="server">Image</th>
                    </tr>
                    <tr id="itemPlaceholder" runat="server">
                    </tr>
                </table>
            </LayoutTemplate>
        </asp:ListView>


因此,有一些“更多”的标记,但你可以更容易地下降在asp.net控件-你没有添加一个模板字段-(约4个额外的行标记的每一列-所以从长远来看,我喜欢列表视图。
它看起来非常相似,就像这样:



后面的代码将是100%与上面相同。

oprakyz7

oprakyz73#

我用的是vs2022.net472。很简单:

Myimage.imageurl = "Data:Image;base64,"+ Base64string

字符串

相关问题