Xamarin : android : Animation 特效 - 按鈕動畫測試

-
如果版面上需要讓 View (控件) 有點特效，其實 android 有提供一些基本2D的特效可以使用，這個就是 Animation。
※先說明Animation在這裡是一種效果，並非我們認知的那種動畫，所以無法設計太多一連串的動作，因此通常比較適合『咻一下子』這種感覺。

1 . 要在要運行的 Activity 引入

Using Android.Views.Animations

2 . 然後在右邊Resource資料夾下建立一個anim資料夾(這個請勿隨意命名，因為在android套件是有關聯的，隨意命名會找不到)



3 . 然後在anim資料夾下建立你的預訂好的動畫(特效)檔案，它基本上就是一個XML檔案。


這個檔案的詳細內容寫法可以參考下面網站：
官方網站(詳細但太多太雜，很容易找不到重點)：https://developer.xamarin.com/guides/android/application_fundamentals/graphics_and_animation/
極客學院(簡單易懂，但無太多詳細解釋)：http://wiki.jikexueyuan.com/project/android-animation/1.html



我這邊準備了幾個特效檔案：
breath.xml (呼吸效果)


<?xml version="1.0" encoding="utf-8" ?>
<alpha xmlns:android="http://schemas.android.com/apk/res/android"
       android:fromAlpha="1.0"
       android:toAlpha="0.3"
       android:duration="500"
       android:fillBefore ="true"
       android:repeatCount="10"
       android:repeatMode="reverse"
/>


fadeinout.xml (淡入淡出)


<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillBefore ="true">
  <alpha
    android:fromAlpha="1.0"
    android:toAlpha="0.7"
    android:duration="100" />
  <alpha
    android:fromAlpha="0.7"
    android:toAlpha ="1.0"
    android:duration="100"
    android:startOffset="100" />
</set>


fadescalecombine.xml (組合淡入出+縮小放大)


<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillBefore ="true">
  <scale
    android:fromXScale="1.0"
    android:toXScale="0.95"
    android:fromYScale="1.0"
    android:toYScale="0.95"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="100" />
  <alpha
   android:fromAlpha="1.0"
   android:toAlpha="0.5"
   android:duration="100" />
  <scale
    android:fromXScale="0.95"
    android:toXScale ="1.0"
    android:fromYScale="0.95"
    android:toYScale ="1.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="100"
    android:startOffset="100" />
  <alpha
    android:fromAlpha="0.5"
    android:toAlpha ="1.0"
    android:duration="100"
    android:startOffset="100" />
</set>


hartattack.xml (心臟病)


<?xml version="1.0" encoding="utf-8" ?>
<scale xmlns:android="http://schemas.android.com/apk/res/android"
       android:fromXScale="1.0"
       android:toXScale="0.85"
       android:fromYScale="1.0"
       android:toYScale="0.85"
       android:pivotX="50%"
       android:pivotY="50%"
       android:duration="100"
       android:fillBefore ="true"
       android:repeatCount="10"
/>


rotate.xml (旋轉)


<?xml version="1.0" encoding="utf-8" ?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
        android:fromDegrees="0"
        android:toDegrees="1080"
        android:pivotX="50%"
        android:pivotY="50%"
        android:duration="700"
        android:fillAfter="true"
        android:repeatMode="reverse"
        android:fillBefore ="true"
        android:repeatCount="1"
/>


rotatejump.xml (一邊旋轉一邊縮小)


<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillBefore ="true">
  <scale
    android:fromXScale="1.0"
    android:toXScale="0.4"
    android:fromYScale="1.0"
    android:toYScale="5"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="200" />
  <rotate
    android:fromDegrees="0"
    android:toDegrees="720"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="700"
    android:startOffset="200"/>
  <scale
    android:fromXScale="1.5"
    android:toXScale="0.3"
    android:fromYScale="1.5"
    android:toYScale="0.3"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="700"
    android:startOffset="200"/>
  <scale
    android:fromXScale="0.5"
    android:toXScale="1.0"
    android:fromYScale="0.5"
    android:toYScale="1.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="100"
    android:startOffset="900" />
</set>


scaleinout.xml (縮小放大)


<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillBefore ="true">
  <scale
    android:fromXScale="1.0"
    android:toXScale="0.95"
    android:fromYScale="1.0"
    android:toYScale="0.95"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="100" />
  <scale
    android:fromXScale="0.95"
    android:toXScale ="1.0"
    android:fromYScale="0.95"
    android:toYScale ="1.0"
    android:pivotX="50%"
    android:pivotY="50%"
    android:duration="100"
    android:startOffset="100" />
</set>


shake.xml (左右振動)


<?xml version="1.0" encoding="utf-8" ?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    android:fillBefore ="true">
  <scale
    android:fromXScale="1.0"
    android:toXScale="0.99"
    android:fromYScale="1.0"
    android:toYScale="1.0"
    android:pivotX="50%"
    android:pivotY="100%"
    android:duration="100" />
  <translate
   android:fromXDelta="0"
   android:toXDelta="-10"
   android:duration="50"
   android:startOffset="100" />
  <translate
   android:fromXDelta="-10"
   android:toXDelta="10"
   android:duration="100"
   android:startOffset="150" />
  <translate
   android:fromXDelta="10"
   android:toXDelta="-10"
   android:duration="100"
   android:startOffset="250" />
  <translate
   android:fromXDelta="-10"
   android:toXDelta="10"
   android:duration="100"
   android:startOffset="350" />
  <translate
   android:fromXDelta="10"
   android:toXDelta="-10"
   android:duration="100"
   android:startOffset="450" />
  <translate
   android:fromXDelta="-10"
   android:toXDelta="0"
   android:duration="50"
   android:startOffset="550" />
</set>


4 .建立 Main.axml
 這個很簡單，就是拉幾個 Button到畫面上而已


5 .在按鈕 Click 事件中建立 Animation 物件，並讓控件 Button 執行 startAnimation


var btn1 = FindViewById<Button>(Resource.Id.button1);
btn1.Click += delegate
{
    //取得載入動畫資源檔(組合淡化&大小)
    Animation animation = AnimationUtils.LoadAnimation(Application.Context, Resource.Animation.fadescalecombine);
    btn1.StartAnimation(animation);
};
var btn2 = FindViewById<Button>(Resource.Id.button2);
btn2.Click += delegate
{
    //取得載入動畫資源檔(大小)
    Animation animation = AnimationUtils.LoadAnimation(Application.Context, Resource.Animation.scaleinout);
    btn2.StartAnimation(animation);
};
var btn3 = FindViewById<Button>(Resource.Id.button3);
btn3.Click += delegate
{
    //取得載入動畫資源檔(淡化)
    Animation animation = AnimationUtils.LoadAnimation(Application.Context, Resource.Animation.fadeinout);
    btn3.StartAnimation(animation);
};


當然你可以在外層定義並產生好特效物件，然後讓需要使用的控件(View)，只是執行相同動畫，共同使用這個 animation 特效的 View 會以相同速率與模式一起運作，感覺好像是同步一般。


namespace BtnClickEfct
{
    [Activity(Label = "BtnClickEfct", MainLauncher = true)]
    public class MainActivity : Activity
    {
        //動畫資源設定在共享外層
        Animation animation;
        protected override void OnCreate(Bundle savedInstanceState)
        {
            base.OnCreate(savedInstanceState);

            // Set our view from the "main" layout resource
            SetContentView(Resource.Layout.Main);
         
            //取得載入動畫資源檔，建立一次大家共用
            animation = AnimationUtils.LoadAnimation(Application.Context, Resource.Animation.fadescalecombine);
         
            //針對要使用的對象加入
            var btn1 = FindViewById<Button>(Resource.Id.button1);
            btn1.Click += delegate
            {
               btn1.StartAnimation(animation);
            };
            var btn2 = FindViewById<Button>(Resource.Id.button2);
            btn2.Click += delegate
            {
               btn2.StartAnimation(animation);
            };


注意到 Resource.Animation 這個資源了嗎？它就是對應 anim 資料夾，所以前面才會說資料夾名稱不可以亂改。

而 Resource.Animation.fadescalecombine 後面 fadescalecombine 看得出來很明顯就是我們的XML檔案了

6 . 如果希望停止 Animation 可以用：


animation.Cancle();


這個指令執行比較像『暫停』，被控制的對象狀態會停止在被 Cancle 的那一刻。
但是要小心，如果許多控制物件共用這個動畫資源，可能會導致大家一起停止。
優點是可以再用一次 下面指令再次啟動：


animation.Start();


這樣感覺有點怪。

不喜歡的話，也可以使用：


btn1.ClearAnimation();


對該控制物件清除動畫設定，控制物件視覺會恢復到原本樣貌。
但如果要再次啟動該控制物件的動畫，就必須再設定一次：


btn1.StartAnimation(animation);





留言

張貼留言

這個網誌中的熱門文章

【研究】列印的條碼為什麼很難刷(掃描)

-
圖片
條碼在我們的世界無處不在，小至發票，大至大型裝置設備都會有它的身影。 每一家有制度化的公司，多少都會需要用到條碼來進行管理，身為開發人員，就很難不會碰到它。 但是我們常常因為不熟悉條碼的規則，而導致作出來的條碼沒辦法被讀取(掃描)，也常遇到A設備可以讀取，B設備就無法讀取的奇怪現象，當然讀取設備本身的讀取元件也是有功力上的差別，有些廠商有能力可以調教讀寫元件的設定。 接下來，我就做點實驗給大家知道這個條碼的問題出在哪裡，以便在往後使用條碼時可以更注意到發生的原因。 在這裡我不再重述條碼的來由，這次的比較是使用大家常用的Code39(又稱39碼)來比較。 使用39碼得主要是因為他有字型檔可以使用，可以拿來做比較。 條碼的列印方式分類與優缺： 一、由條碼機(又稱標籤機)內建指令列印 優點：線條清晰，掃描讀取容易、速度快。             列印特殊紙張(背膠式、連續型.....) 缺點：特殊的指令語言(每一個廠牌都不太一樣)，等於換機器就要改寫程式碼。             有一些貼心的廠商(精聯)會提供比較簡單的統一語言列印工具，減少開發者困擾。             版面變化較少，沒有視覺化編輯。 二、由Windows Driver列印，或稱普通列印 優點：只要有驅動程式就可以列印，不需要改寫程式(或改寫幅度小)。            版面彈性比較自由。由於只要有驅動就可以列印，            所以比較不限定紙張種類，或印表機種類。 缺點：列印線條有很多模糊地帶，沒控制好就會導致無法讀取。            受到列印裝置解析度限制，匹配沒做好就會失敗。 底下先做出三種情境比較： 雷射印表機：600DPI 條碼印表機(標籤機)：203DPI 這裡，我們先 比較印表機解析度的列印差異 ，請忽略機器種類。
裡面更多內容 》》》

統一發票列印小程式

-
圖片
1、請注意本版留言過多， 您的留言可能不在這一頁，請到以下留言樓層看看再回應喔～  2、如果您有填寫表單，卻沒有收到我的郵件，有可能您填寫的電子郵件有錯誤，麻煩您查看一下留言是否有我給您的信息喔。因為我沒辦法直接連繫到您。 1 ~200 則，請按這裡   200+ 以上請按這裡 因為公司會在一堆系統上都有可能要印發票(真不懂要怎麼搞?) 希望可以有個小工具可以列印電子發票， 原本發票列印程式要使用條碼機專用語言(ZPL、EPL)，但容易被某種機型綁定。 當然可以考慮使用ESC/POS指令的方式，但也是要印表機支援這種指令列印模式(當然多數表機都有支援)，不過要列印QR碼，就有點不是那麼容易了，除了要自己編碼外還要注意中文問題。 後來我想改用Windows Printer Driver來列印，雖然不如指令式快速，但可以方便各類型程式應用，因此考慮了以下的條件： 使用C#開發、.Net 2.0平台、Console呼叫 本來想用RDLC來做，但是很不幸的，失敗了，原因就在於條碼， 國稅局訂定的Code39條碼內要放入21個字元(19+2)長度， 如果使用RDLC的話，解析度只有100DPI，密度不夠，條碼線條沾黏嚴重。 一般的條碼機至少都有200DPI得等級，這RDLC也太彆腳了吧， 網路上找盡RDLC條整解析度的方式都沒有比較好的效果。 因此，改用直接C#繪製的方式來做， 當然中間為了條碼圖像清晰度的問題花了不少心力解決。 下載點： PrintInvoice
裡面更多內容 》》》

C# 使用 Process.Start 執行外部程式

-
圖片
C# 執行外部程式的方式並不難，也很簡單，首先引入 using System.Diagnostics; 然後使用 Process.Start( "OtherProgram.exe" ) 方式就可以呼叫並執行。 但是，某些情況下會導致程式無法被執行(或是無法正常執行)， 很多原因在於『執行程式的起始位置』，由於被呼叫的程式執行時， 它所啟動的路徑其實是在呼叫程式的路徑下， 如果被呼叫程式需要讀取與程式相同路徑下的文件檔案(或是INI)，可能會導致找不到的問題。 為了測試這樣的現象，我準備了2支程式， 一支是被呼叫端的程式 HelloConsole.exe 另外一支就是呼叫端程式 CallOtherProgram.exe HelloConsole.exe 這支程式 在啟動時會讀取相同路徑下的 Doc.txt 並將內容顯示出來，如果有參數也會把參數列出來。而這支程式我固定放在 D:\TEST\ 下，以方便測試，如果不是在這路徑下，那呼叫端的程式碼裡面的路徑也要變更。 HelloConsole.exe using System; using System.IO; namespace HelloConsole {     class Program     {         static void Main(string[] args)         {             Console.WriteLine("This is HelloConsole.exe");             Console.WriteLine(" ");             Console.WriteLine("Environment.CurrentDirectory is ");             Console.WriteLine(Env...
裡面更多內容 》》》