Bagikan melalui


Memodifikasi Animasi Dari Sisi Server (C#)

oleh Christian Wenz

Unduh PDF

Kontrol Animasi di ASP.NET AJAX Control Toolkit bukan hanya kontrol tetapi seluruh kerangka kerja untuk menambahkan animasi ke kontrol. Animasi juga dapat diubah di sisi server

Gambaran Umum

Kontrol Animasi di ASP.NET AJAX Control Toolkit bukan hanya kontrol tetapi seluruh kerangka kerja untuk menambahkan animasi ke kontrol. Animasi juga dapat diubah di sisi server

Langkah-langkah

Pertama-tama, sertakan ScriptManager di halaman; kemudian, pustaka AJAX ASP.NET dimuat, sehingga memungkinkan untuk menggunakan Control Toolkit:

<asp:ScriptManager ID="asm" runat="server" />

Animasi akan diterapkan ke panel teks yang terlihat seperti ini:

<asp:Panel ID="panelShadow" runat="server" CssClass="panelClass">
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
 ASP.NET AJAX is a free framework for quickly creating a new generation of more 
 efficient, more interactive and highly-personalized Web experiences that work 
 across all the most popular browsers.<br />
</asp:Panel>

Di kelas CSS terkait untuk panel, tentukan warna latar belakang yang bagus dan atur juga lebar tetap untuk panel:

<style type="text/css">
 .panelClass {background-color: lime; width: 300px;}
</style>

Kode lainnya berjalan di sisi server dan tidak menggunakan markup; sebaliknya, ia menggunakan kode untuk membuat AnimationExtender kontrol:

<script runat="server">
void Page_Load()
{
 AjaxControlToolkit.AnimationExtender ae = new AjaxControlToolkit.AnimationExtender();
 ae.TargetControlID = "Panel1";

Namun, Control Toolkit saat ini tidak menyediakan akses API untuk membuat animasi individual. Namun dimungkinkan untuk mengatur AnimationExtenderproperti Animasi ke string yang berisi markup XML yang digunakan saat menetapkan animasi secara deklaratif. Untuk membuat XML yang tidak boleh berisi <Animations> elemen, Anda dapat menggunakan dukungan XML .NET Framework atau, seperti dalam kode berikut, cukup berikan string:

ae.Animations = "<OnLoad><Parallel><FadeOut Duration=\"1.5\"
 Fps=\"24\" /><Resize Width=\"1000\" Height=\"150\"
 Unit=\"px\" /></Parallel></OnLoad>";

Terakhir, tambahkan AnimationExtender kontrol ke halaman saat ini, di <form runat="server"> dalam elemen , pastikan animasi disertakan dan dijalankan:

form1.Controls.Add(ae);
}
</script>

Animasi dibuat menggunakan kode C#/VB sisi server

Animasi dibuat menggunakan kode C#/VB sisi server (Klik untuk melihat gambar ukuran penuh)