شروع 01 اولین قدم خیلی مهمه، خیلیا به خاطر ترس از شکست شروع نمیکنن
پس ترس رو بزار کنار و شروع کن
فقط شروع کن
تمرین و تکرار 02 خیلیا وارد حوزه برنامه نویسی میشن و به خاطر سختی هاش سریع جا میزنن و عقب میکشن
پس اگه میخوای موفق بشی فقط و فقط تمرین کن و پشتکار داشته باش
پشتکار
حرف اول و آخر رو میزنه
موفقیت 03 زمانی میتونی به این مرحله برسی که واقعا تلاش کرده باشی. برنامه نویسی واقعا راحت نیستش
اگه خوب تلاش کنی، مطمئن باش نتیجه زحماتت رو خیلی خوب دریافت میکنی
موفقیت رو باید به دست بیاری

ساخت انیمیشن ScanBar در اندروید

ساخت انیمیشن ScanBar در اندروید
اندروید

ساخت انیمیشن ScanBar در اندروید

انیمیشن ها باعث میشن که اپلیکیشن ما رابط کاربری جذاب و حرفه ای داشته باشن.

کاربرا از کار با برنامه خسته نشن و درکل باعث زیبایی برنامه ها میشن.

این پست هم مربوط میشه به ساخت یه انیمیشن جذاب.

انیمیشنی که تقریبا شبیه اسکن کردی چیزی هستش.

برای همین هم اسمش رو ScanBar گذاشتم.

از این انیمیشن میتونی مثلا موقع آپلود عکس استفاده کنی، موقع دریافت اثر انگشت کاربر برای ورود به یه بخش امنیتی و یا هرجای دیگه ای که دوست داری استفاده کنی.

این پایین میتونی دمو انیمیشن رو ببینی :

نمایش ویدیو در یوتیوب

خب حالا که ویدیو دمو رو دیدی بریم دیگه سراغ آموزشش.

اول کد ها رو قرار میدم.

انتها همین پست هم ویدیو کامل آموزشی و همچنین فایل های مورد نظر رو قرار میدم.

توی این مطلب، کدها اصلی رو قرار میدم. یعنی کدهای فرگمنت و کدهای فایل انیمیشن.

اول از همه بریم کدهای انیمیشن رو ببینیم
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:motion="http://schemas.android.com/apk/res-auto"
    android:fillAfter="true"
    motion:motionInterpolator="@android:anim/linear_interpolator">

    <translate
        android:duration="900"
        android:fillAfter="true"
        android:fromYDelta="0%p"
        android:toYDelta="53%p" />

    <translate
        android:duration="900"
        android:fillAfter="true"
        android:fromYDelta="0%p"
        android:startOffset="800"
        android:toYDelta="-53%p" />

</set>

خب حالا باید کدهای فرگمنت رو بزنید.

فرگمنت هم شامل 2 بخش میشه.

بخش اول : لایه

بخش دوم : کد کاتلین

کد مربوط به لایه فرگمنت :
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".scan_animation.ScanAnimPage">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="30dp">

        <ImageView
            android:id="@+id/scanFrame"
            android:layout_width="150dp"
            android:layout_height="150dp"
            android:layout_centerHorizontal="true"
            android:src="@drawable/scan_bar2" />

        <ImageView
            android:id="@+id/userImage"
            android:layout_width="120dp"
            android:layout_height="120dp"
            android:layout_alignLeft="@id/scanFrame"
            android:layout_alignTop="@id/scanFrame"
            android:layout_alignRight="@id/scanFrame"
            android:layout_alignBottom="@id/scanFrame"
            android:padding="15dp"
            android:src="@drawable/my" />

        <ImageView
            android:id="@+id/scanLine"
            android:layout_width="120dp"
            android:layout_height="10dp"
            android:layout_centerHorizontal="true"
            android:layout_margin="5dp"
            android:src="@drawable/scan_line2" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/scanFrame"
            android:layout_marginTop="30dp"
            android:layout_marginBottom="30dp"
            android:fontFamily="@font/iran_sans"
            android:gravity="center"
            android:text="تصویر شما با موفقی بارگذاری شد\n منتظر اسکن بمانید"
            android:textColor="@color/pink"
            android:textSize="14sp" />

    </RelativeLayout>

</FrameLayout>
خب در نهایت هم کدهای کاتلین مربوط به فرگمنت :
class ScanAnimFragment : BottomSheetDialogFragment() {

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?, savedInstanceState: Bundle?
    ): View? {
        return inflater.inflate(R.layout.fragment_scan_animation, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)

        setAnimation()
    }

    private fun setAnimation(){
        val anim = AnimationUtils.loadAnimation(requireContext(),R.anim.up_down)

        scanLine.startAnimation(anim)

        anim.setAnimationListener(object : Animation.AnimationListener{
            override fun onAnimationStart(animation: Animation?) {

            }

            override fun onAnimationEnd(animation: Animation?) {
                val anim = AnimationUtils.loadAnimation(requireContext(),R.anim.up_down)
                anim.setAnimationListener(this)
                scanLine.startAnimation(anim)
            }

            override fun onAnimationRepeat(animation: Animation?) {

            }

        })
    }
}

خب دیگه کار تموم شد.

ولی اگه میخوای بدونی که هر بخش از کد چه کاری انجام میدن و این کدها رو کامل یاد بگیری

پس ویدیو کامل آموزشی رو ببین.

نمایش کامل ویدیو آموزشی :

نمایش ویدیو در یوتیوب

فایل های مربوط به عکس اسکن کردن رو هم میزارم که بتونی راحت ازشون استفاده کنی

دانلود فایل های استفاده شده

خب این آموزش هم همینجا تموم شد.

امیدوارم که بتونید از این آموزش جاهای مختلفی استفاده کنید.

سوالی داشتید حتما توی کامنت ها ازم بپرسید.🌹🌹

دیدگاه خود را اینجا قرار دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

چهار × 2 =

فیلدهای نمایش داده شده را انتخاب کنید. دیگران مخفی خواهند شد. برای تنظیم مجدد سفارش ، بکشید و رها کنید.
  • عکس
  • شناسه محصول
  • امتیاز
  • قیمت
  • در انبار
  • موجودی
  • افزودن به سبد خرید
  • توضیحات
  • محتوا
  • عرض
  • اندازه
  • تنظیمات بیشتر
  • ویژگی ها
  • Custom attributes
  • زمینه های دلخواه
مقایسه
لیست علاقه مندی ها 0