「ASP.NET/asp007」の編集履歴(バックアップ)一覧はこちら
「ASP.NET/asp007」(2010/07/20 (火) 17:27:07) の最新版変更点
追加された行は緑色になります。
削除された行は赤色になります。
&topicpath()
**画像を縮小表示する(ASP.NET)
****メモ
透過GIFは透過でなくなってしまう。Bitmapに変換してから縮小しているから?
***テーブルのレイアウト
|BGCOLOR(#eeeeee):CENTER:''フィールド名''|BGCOLOR(#eeeeee):CENTER:''データ型''|BGCOLOR(#eeeeee):|
|id|int|ID(主キー 連番)|
|subject|varchar(300)|件名|
|title|varchar(100)|ファイル名|
|type|varchar(50)|MIMEタイプ|
|idata|varbinary(MAX)|バイナリ・データ|
|last_modified|datetime|最終更新日|
***Thumbnail2.aspx
#highlight(linenumber){<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>画像を縮小して表示(ASP.NET)</title>
</head>
<body>
<form id="form1" runat="server">
<h3>
画像を縮小して表示 ASP.NET版</h3>
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default.aspx">戻る</asp:HyperLink>
<p>
100px×100pxに収まるように比率を維持して縮小</p>
<asp:DataList ID="DataList1" runat="server" DataKeyField="id" DataSourceID="SqlDataSource1">
<ItemTemplate>
<strong>
id:</strong>
<asp:Label ID="lblId" runat="server" Text='<%# Eval("id") %>'></asp:Label>
<strong>
subject:</strong>
<asp:Label ID="lblSubject" runat="server" Text='<%# Eval("subject") %>'></asp:Label><br />
<asp:Image ID="imgIdata" runat="server" CssClass="thumb" /><br />
<hr />
</ItemTemplate>
</asp:DataList>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NetWorks01ConnectionString %>"
SelectCommand="SELECT [id], [subject] FROM [d_Image]">
</asp:SqlDataSource>
</form>
</body>
</html>}
***Thumbnail2.aspx.vb
#highlight(linenumber,vb){Partial Class ImageThumbnail_Thumbnail2
Inherits System.Web.UI.Page
Protected Sub DataList1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataListItemEventArgs) Handles DataList1.ItemDataBound
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = ListItemType.AlternatingItem Then
Dim id As Label = CType(e.Item.FindControl("lblId"), Label)
Dim image As Image = CType(e.Item.FindControl("imgIdata"), Image)
image.ImageUrl = "Image2.aspx?id=" & id.Text
End If
End Sub
End Class}
***Image2.aspx
※空のページ
#highlight(linenumber){<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>画像</title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>}
***Image2.aspx.vb
#highlight(linenumber,vb){Imports System.Data.SqlClient
Imports System.Data
Partial Class ImageThumbnail_Image2
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
'選択されたIDの画像をDBから取り出して表示する。
Dim id As Integer
id = Request.QueryString("id")
Dim db As New SqlConnection(ConfigurationManager.AppSettings("dbstr"))
Dim cmd As SqlCommand = New SqlCommand("SELECT type,idata FROM d_Image WHERE id=@p1", db)
Dim p1 As SqlParameter = cmd.Parameters.Add("@p1", SqlDbType.Int)
p1.Value = id
db.Open()
Dim rs As SqlDataReader = cmd.ExecuteReader()
If rs.Read Then
Dim oW As Integer = 100 ' サムネイル表示サイズ横
Dim oH As Integer = 100 ' サムネイル表示サイズ縦
Dim bmp As System.Drawing.Bitmap = System.Drawing.Bitmap.FromStream(New System.IO.MemoryStream(DirectCast(rs("idata"), Byte())))
If bmp.Width > oW Or bmp.Height > oH Then
Dim s As Double = Math.Min(oW / bmp.Width, oH / bmp.Height)
Dim sW As Integer = CInt(s * bmp.Width)
Dim sH As Integer = CInt(s * bmp.Height)
Dim outBmp As System.Drawing.Bitmap = New System.Drawing.Bitmap(sW, sH)
Using g As System.Drawing.Graphics = System.Drawing.Graphics.FromImage(outBmp)
g.DrawImage(bmp, 0, 0, sW, sH)
End Using
Response.ContentType = CType(rs("type"), String)
outBmp.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg)
Else
Response.ContentType = CType(rs("type"), String)
Response.BinaryWrite(DirectCast(rs("idata"), Byte()))
End If
Response.End()
End If
rs.Close()
db.Close()
End Sub
End Class
}
***参考にさせていただいたページ
-[[C# と VB.NET の質問掲示板:GridViewにDBの画像を縦横比保持して縮小表示するには>http://bbs.wankuma.com/index.cgi?mode=al2&namber=39957&KLOG=68]]
----
&topicpath()
**画像を縮小表示する(ASP.NET)
****メモ
透過GIFは透過でなくなってしまう。Bitmapに変換してから縮小しているから?
***テーブルのレイアウト
|BGCOLOR(#eeeeee):CENTER:''フィールド名''|BGCOLOR(#eeeeee):CENTER:''データ型''|BGCOLOR(#eeeeee):|
|id|int|ID(主キー 連番)|
|subject|varchar(300)|件名|
|title|varchar(100)|ファイル名|
|type|varchar(50)|MIMEタイプ|
|idata|varbinary(MAX)|バイナリ・データ|
|last_modified|datetime|最終更新日|
***Thumbnail2.aspx
#highlight(linenumber){<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>画像を縮小して表示(ASP.NET)</title>
</head>
<body>
<form id="form1" runat="server">
<h3>
画像を縮小して表示 ASP.NET版</h3>
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default.aspx">戻る</asp:HyperLink>
<p>
100px×100pxに収まるように比率を維持して縮小</p>
<asp:DataList ID="DataList1" runat="server" DataKeyField="id" DataSourceID="SqlDataSource1">
<ItemTemplate>
<strong>
id:</strong>
<asp:Label ID="lblId" runat="server" Text='<%# Eval("id") %>'></asp:Label>
<strong>
subject:</strong>
<asp:Label ID="lblSubject" runat="server" Text='<%# Eval("subject") %>'></asp:Label><br />
<asp:Image ID="imgIdata" runat="server" CssClass="thumb" /><br />
<hr />
</ItemTemplate>
</asp:DataList>
<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NetWorks01ConnectionString %>"
SelectCommand="SELECT [id], [subject] FROM [d_Image]">
</asp:SqlDataSource>
</form>
</body>
</html>}
***Thumbnail2.aspx.vb
#highlight(linenumber,vb){Partial Class ImageThumbnail_Thumbnail2
Inherits System.Web.UI.Page
Protected Sub DataList1_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataListItemEventArgs) Handles DataList1.ItemDataBound
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType = ListItemType.AlternatingItem Then
Dim id As Label = CType(e.Item.FindControl("lblId"), Label)
Dim image As Image = CType(e.Item.FindControl("imgIdata"), Image)
image.ImageUrl = "Image2.aspx?id=" & id.Text
End If
End Sub
End Class}
***Image2.aspx
※空のページ
#highlight(linenumber){<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>画像</title>
</head>
<body>
<form id="form1" runat="server">
<div>
</div>
</form>
</body>
</html>}
***Image2.aspx.vb
#highlight(linenumber,vb){Imports System.Data.SqlClient
Imports System.Data
Partial Class ImageThumbnail_Image2
Inherits System.Web.UI.Page
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
'選択されたIDの画像をDBから取り出して表示する。
Dim id As Integer
id = Request.QueryString("id")
Dim db As New SqlConnection(ConfigurationManager.AppSettings("dbstr"))
Dim cmd As SqlCommand = New SqlCommand("SELECT type,idata FROM d_Image WHERE id=@p1", db)
Dim p1 As SqlParameter = cmd.Parameters.Add("@p1", SqlDbType.Int)
p1.Value = id
db.Open()
Dim rs As SqlDataReader = cmd.ExecuteReader()
If rs.Read Then
Dim oW As Integer = 100 ' サムネイル表示サイズ横
Dim oH As Integer = 100 ' サムネイル表示サイズ縦
Dim bmp As System.Drawing.Bitmap = System.Drawing.Bitmap.FromStream(New System.IO.MemoryStream(DirectCast(rs("idata"), Byte())))
If bmp.Width > oW Or bmp.Height > oH Then
Dim s As Double = Math.Min(oW / bmp.Width, oH / bmp.Height)
Dim sW As Integer = CInt(s * bmp.Width)
Dim sH As Integer = CInt(s * bmp.Height)
Dim outBmp As System.Drawing.Bitmap = New System.Drawing.Bitmap(sW, sH)
Using g As System.Drawing.Graphics = System.Drawing.Graphics.FromImage(outBmp)
g.DrawImage(bmp, 0, 0, sW, sH)
End Using
Response.ContentType = CType(rs("type"), String)
outBmp.Save(Response.OutputStream, System.Drawing.Imaging.ImageFormat.Jpeg)
Else
Response.ContentType = CType(rs("type"), String)
Response.BinaryWrite(DirectCast(rs("idata"), Byte()))
End If
Response.End()
End If
rs.Close()
db.Close()
End Sub
End Class
}
***参考にさせていただいたページ
-[[C# と VB.NET の質問掲示板:GridViewにDBの画像を縦横比保持して縮小表示するには>http://bbs.wankuma.com/index.cgi?mode=al2&namber=39957&KLOG=68]]
----
[Counter] Total:&counter(total)
表示オプション
横に並べて表示:
変化行の前後のみ表示: