SuperTextView
v3.2.6.99
إعلانات جيتا
مرحبًا، أيها المطور، مرحبًا بك في استخدام SuperTextView !
شكرًا لك ولعشرات الآلاف من مطوري Android على ثقتك بي؟
يختلف SuperTextView من حيث أنه مجرد عنصر عرض بسيط، ولكنه ليس مجرد عرض.
إنه حيوي وديناميكي، مع منطق مضمن قوي يستمر في تزويدك بدعم تطوير غني وبسيط بشكل استثنائي.
يوفر لك SuperTextView منطق العرض المعقد. باستدعاء أسلوب API بسيط، تتوفر تأثيرات العرض المبهرة على الفور.
كل ما عليك فعله هو الاستمتاع بالمؤثرات البصرية المذهلة التي كتبتها، وسيتم تسليم الباقي إلى SuperTextView .
؟ انقر هنا (أو قم بمسح رمز الاستجابة السريعة أدناه) لتنزيل العرض التوضيحي
【البوابة】:《وثيقة مرجعية لتطوير SuperTextView》- يمكنك معرفة كيفية استخدام SuperTextView لبناء التطبيق الخاص بك بشكل أكثر كفاءة
【البوابة】:《مستند SuperTextView API》— يمكنك عرض جميع واجهات برمجة التطبيقات والخصائص المتاحة لـ SuperTextView
قم بإضافته في build.gradle:
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
dependencies {
compile 'com.github.chenBingX:SuperTextView:VERSION_CODE'
}
يمكن العثور على رمز الإصدار لأحدث إصدار هنا.
دعم الإصدار 3.2.6 : armeabi-v7a
دعم الإصدار 3.2.6.64 : armeabi-v7a و arm64-v8a
دعم الإصدار 3.2.6.99 : armeabi-v7a و arm64-v8a و x86
proguard-rules.pro يرجى إضافة -keep class com.coorchice.library.gifdecoder.JNI { *; }
في XML، استخدم "صورة الشبكة" كصورة خلفية
< com .coorchice.library.SuperTextView
android:id =" @+id/stv_40 "
android:layout_width =" 150dp "
android:layout_height =" 150dp "
android:layout_gravity =" center_horizontal "
android:layout_marginTop =" 16dp "
android:gravity =" bottom|center "
android:paddingBottom =" 1dp "
android:text ="网络背景图"
android:textColor =" #000 "
android:textSize =" 14sp "
app:stv_corner =" 10dp "
app:stv_isShowState =" true "
app:stv_drawableAsBackground =" true "
app:stv_solid =" #f1f1f1 "
app:stv_state_drawable =" https://gw.alicdn.com/imgextra/i3/O1CN01suhAFr1cXQX49D2xp_!!6000000003610-0-tps-468-466.jpg " />في XML، قم بتعيين "صورة الشبكة" لـ StateDrawable2
< com .coorchice.library.SuperTextView
android:id =" @+id/stv_41 "
android:layout_width =" 350dp "
android:layout_height =" 100dp "
android:layout_gravity =" center_horizontal "
android:layout_marginTop =" 30dp "
android:paddingLeft =" 116dp "
android:paddingTop =" 30dp "
android:text =" StateDrawable2 网络图"
android:textColor =" @color/black "
android:textSize =" 14sp "
app:stv_corner =" 50dp "
app:stv_isShowState2 =" true "
app:stv_left_bottom_corner =" true "
app:stv_left_top_corner =" true "
app:stv_solid =" #f1f1f1 "
app:stv_state_drawable2 =" https://gw.alicdn.com/imgextra/i3/O1CN01XPmcmt1vJfKcQ8o6O_!!6000000006152-0-tps-500-500.jpg "
app:stv_state_drawable2_height =" 100dp "
app:stv_state_drawable2_mode =" left "
app:stv_state_drawable2_width =" 100dp " /> stv_pressBgColor غير صالحإصلاح إمكانية الكتابة المباشرة لقيمة اللون السداسية العشرية، ولا يتم عرض المشكلة
دعم قابل للرسم للطبقة المحددة
<com.coorchice.library.SuperTextView
...
// Configuring the level of Drawable1
app:stv_state_drawable_layer="beforeText"
// Configuring the level of Drawable2
app:stv_state_drawable2_layer="afterText"
...
/>
وضع الدعم:
- `beforeText`，Before the text
- `afterText`，After the text
لدى Java وظائف مقابلة لدعم التكوين الديناميكي.
مشكلة إبطال تبديل ScaleType في وضع القياس عند إصلاح Drawable1 كصورة خلفية
تحسين حدود النص
تحسين عرض GIF الشفاف
في الإصدار v3.2.0 الجديد، يعيد SuperTextView تعريف نفسه مرة أخرى. أيها المطورون، ألقوا نظرة على المفاجآت المعدة لكم!؟؟؟
هذه المرة، يقدم SuperTextView دعمًا قويًا لبرنامج تشغيل Gif للمطورين.
إذا كنت منزعجًا في الماضي بشأن كيفية عرض مخطط Gif على نظام Android الأساسي، أو كنت عالقًا في هاوية الأداء لبعض مكتبات Gif ثلاثية الأطراف. ولكن الآن سوف يغير SuperTextView هذا الوضع تمامًا.
يعد Gif و SuperTextView طبيعيين وطبيعيين، لذا يمكنك عرض مخطط Gif بالطريقة الأكثر شيوعًا وطبيعية. الأمر بسيط مثل إظهار صورة عادية كالمعتاد.
بفضل الأداء الفائق لـ c/c++ والتشغيل الدقيق للذاكرة. قام SuperTextView بتخصيص محرك تشغيل Gif القوي لمنصات الأجهزة المحمولة باستخدام c/c++ .
يقوم محرك Gif الخاص بـ SuperTextView ، والذي يمكنه معالجة ذاكرة بكسل الصورة بدقة، بتحديث ذاكرة البكسل المحلية فقط عند تحديث إطار صورة Gif ، مما يجعل كفاءة عرض صورة Gif تحقق قفزة نوعية.
من خلال تقنية العرض غير المتزامن خارج الشاشة، يمكن لـ SuperTextView ضمان واجهة تطبيق سلسة وسلسة وسرعة استجابة حساسة حتى عند عرض صور Gif كبيرة.
في العرض التوضيحي أعلاه، يُظهر استخدام SuperTextView صورة Gif مع صورة ذات 265 إطارًا، لكن واجهة المستخدم لا تزال سلسة للغاية.
عرض مخطط Gif في SuperTextView ، سهل للغاية!
يمكنك تكوينه مباشرة في مستند تخطيط XML أو إضافته في التعليمات البرمجية الخاصة بك.
<com.coorchice.library.SuperTextView
android:id="@+id/stv_1"
android:layout_width="match_parent"
android:layout_height="150dp"
app:stv_state_drawable="@drawable/gif_1" />
يمكنك عرض مخطط Gif لتكوين SuperTextView تمامًا مثل تكوين صورة عادية.
stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setDrawable(R.drawable.gif_1);
الأمر بهذه البساطة والطبيعية، يتيح SuperTextView للمطورين عرض مخطط Gif دون أي وعي.
في منطق النواة لـ SuperTextView ، يقوم SuperTextView بذكاء بتصنيف الرسم البياني العادي والرسم البياني Gif ، ثم يقوم بمعالجته وتحسينه وفقًا لذلك.
ماذا لو لم يكن ملف GIF الخاص بك محليًا ولكن في السحابة؟
لا داعي للقلق بشأن ذلك! يتم تسليم كل شيء إلى SuperTextView .
stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setUrlImage("http://example.com/images/example.gif");
باستخدام سطر واحد فقط من التعليمات البرمجية، سيساعدك SuperTextView في الخلفية لتحميل صورة Gif ثم معالجة العرض على الشاشة.
في الواقع، يمكن استخدام بتات عرض الصور Drawable1 و Drawable2 الخاصة بـ SuperTextView لعرض صور Gif . باختصار، كل شيء هو ما تعرفه.
لا يعرض SuperTextView صور Gif فحسب، بل يمكنك أيضًا التحكم في المزيد من التفاصيل.
يمكنك التحكم في GIF أو تشغيله أو إيقافه مؤقتًا في أي وقت.
if (stv.getDrawable() instanceof GifDrawable) {
// Get the GifDrawable first
GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();
// Play
gifDrawable.play();
// Pause
gifDrawable.stop();
}
في SuperTextView ، يمكنك دائمًا الوصول إلى صورة الإطار الذي تحدده، بالإضافة إلى الصورة التي يمكن استخراجها إلى الإطار المحدد.
if (stv.getDrawable() instanceof GifDrawable) {
// Get the GifDrawable first
GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();
// Jump to the specified frame
gifDrawable.gotoFrame(pre);
// Get the specified frame
Bitmap frame = gifDrawable.getFrame(i);
}
نظرًا لأن SuperTextView يمكن أن يدعم العرض المتزايد المحلي، فعندما يدعم Gif وضع العرض هذا، فهذا يعني أنك قد تحتاج إلى تمكين ** الوضع الصارم عن طريق استدعاء
gifDrawable.setStrict(true)للتأكد من صحة انتقال الإطار أو صورة استخراج الإطار. قد يستغرق هذا بعض الوقت، لذا يجب أن تحاول تنفيذ العمليات ضمن ** الوضع الصارم * في سلسلة محادثات غير متزامنة.
يتيح لك SuperTextView تعديل معدل تشغيل مخطط Gif حسب الرغبة.
if (stv.getDrawable() instanceof GifDrawable) {
// Get the GifDrawable first
GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();
// Set the frame playback interval, 20 ms
gifDrawable.setFrameDuration(20);
}
مع SuperTextView يمكنك الحصول على لمحة عن معلومات Gif .
احصل على حجم GIF
// Get width
int width = gifDrawable.getWidth();
// Get height
int height = gifDrawable.getHeight();
احصل على معلومات إطار GIF
// Get the number of frames
int frameCount = gifDrawable.getFrameCount();
// Get the current frame interval
int frameDuration = gifDrawable.getFrameDuration();
// Get the current render to that frame
int framePotision = gifDrawable.getCurrentFrame();
// Whether it is playing
boolean isPlaying = gifDrawable.isPlaying();
** SuperTextView ** و ** Gif ** تم تقديمهما بفضل التكامل السلس، بعد ** Drawable1 ** و ** Drawable2 ** جميع عناصر التكوين في الشاشة ** Gif ** الشكل أيضًا يمكن أن تدخل حيز التنفيذ.
app:stv_state_drawable_rotate="90"
دعونا نلقي نظرة على ما يحدث مع GIF في الموضع الأصلي القابل للرسم .
<com.coorchice.library.SuperTextView
android:layout_width="match_parent"
android:layout_height="50dp"
android:paddingLeft="62dp"
android:paddingRight="10dp"
android:text="小火箭发射了！啦啦啦啦啦啦..."
android:textColor="#ffffff"
android:textSize="22dp"
app:stv_corner="6dp"
app:stv_isShowState="true"
app:stv_solid="#0D1831"
// set Gif
app:stv_state_drawable="@drawable/gif_1"
// set Gif height
app:stv_state_drawable_height="40dp"
// set Gif width
app:stv_state_drawable_width="40dp"
// set Gif to left
app:stv_state_drawable_mode="left"
// set Gif left spacing
app:stv_state_drawable_padding_left="10dp"/>
التأثير هو...
الآن دعونا نحاول تدوير Gif بمقدار 90 درجة.
<com.coorchice.library.SuperTextView
...
// set Gif to rotate 90 degrees
app:stv_state_drawable_rotate="90"
...
/>
SuperTextView تنفيذ Gif المذهل تفتح شريحة الرسم البياني بابًا جديدًا للمطورين.
ومع ذلك، فإن تحقيق هذا التأثير بسيط بشكل مدهش.
<com.coorchice.library.SuperTextView
android:layout_width="185dp"
android:layout_height="138.75dp"
android:layout_gravity="center_horizontal"
app:stv_corner="20dp"
// set Gif as the control background
app:stv_drawableAsBackground="true"
app:stv_scaleType="fitCenter"
// Configuring Gif
app:stv_state_drawable="@drawable/gif_1" />
يمكن للمطورين بسهولة إضافة حدود إلى ملف Gif .
<com.coorchice.library.SuperTextView
android:layout_width="350dp"
android:layout_height="148.4dp"
android:layout_gravity="center_horizontal"
android:gravity="center"
// add the text will be more stylish
android:text="SuperTextView"
android:textSize="36dp"
android:textStyle="bold"
android:visibility="invisible"
app:stv_corner="6dp"
app:stv_drawableAsBackground="true"
app:stv_isShowState="true"
app:stv_scaleType="center"
// Set the border color
app:stv_stroke_color="@color/opacity_8_gray_4c
// Set the border width
app:stv_stroke_width="5dp"
app:stv_text_fill_color="#ccffffff"
app:stv_text_stroke="true"
app:stv_text_stroke_color="#cc000000"
app:stv_text_stroke_width="2dp"
// Configuring Gif
app:stv_state_drawable="@drawable/gif_1"/>
يتم تقديم التأثير على الفور ...
في الماضي، كانت بعض الديناميكيات الرائعة تتوقف في كثير من الأحيان عند مدى تعقيد التنفيذ وتكاليفه. ويوفر لك SuperTextView المزيد من الإمكانيات، ويمكن أن يكون إلهامك مجانيًا.
على سبيل المثال، سيكون تنفيذ الصور الرمزية الديناميكية أبسط من أي وقت مضى.
<com.coorchice.library.SuperTextView
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_marginLeft="30dp"
app:stv_corner="40dp"
// Set as background image
app:stv_drawableAsBackground="true"
// Configure Gif avatar
app:stv_state_drawable="@drawable/gif_avatar"
// Add border
app:stv_stroke_color="#ffffff"
app:stv_stroke_width="3dp"
/>
في التعليمات البرمجية، يمكنك تكوين الصورة الرمزية الديناميكية للويب مباشرة.
stv.setUrlImage("http://gif_avatar.gif");
في الإصدار الجديد من SuperTextView ، يتم منح Drawable1 و Drawable2 إمكانيات جديدة - دعم النقرات الدقيقة.
SuperTextView من خلال مراقبة الموقع الذي يحدث فيه إجراء النقر، يمكن تحديد موقع إجراء النقر بدقة في المنطقة التي حدث فيها ( Draable1 أو Drawable2 أو مناطق أخرى )، ثم تشغيل عمليات رد اتصال الاستماع وفقًا لذلك.
يمكنك ضبط مستمع إجراء النقر على Drawable لـ SuperTextView لتقديم استجابة دقيقة عند حدوث إجراء ما.
stv.setOnDrawableClickedListener(new SuperTextView.OnDrawableClickedListener() {
@Override
public void onDrawable1Clicked(SuperTextView stv) {
// Drawable1 clicked，do something...
}
@Override
public void onDrawable2Clicked(SuperTextView stv) {
// Drawable2 clicked，do something...
}
});
stv.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// Non-Drawable area is clicked, do something...
}
});
الآن، عند استخدام Drawable1 كصورة خلفية، يمكنك تكوين أوضاع تكبير مختلفة لها لتحقيق التأثير المفضل لديك.
stv.setScaleType(ScaleType.CENTER);
يوفر SuperTextView للمطورين ما يصل إلى 3 أوضاع تكبير:
ScaleType.FIT_XY
تمديد الصورة إلى البلاط.
ScaleType.FIT_CENTER
توسيط الصورة بشكل تكيفي.
ScaleType.CENTER
قص الصورة في المنتصف. الافتراضيات.
في مستند تخطيط XML ، يدعم Drawable1 و Drawable2 الآن لون الإعداد المباشر أو ShapeDrawable .
// Circle_f9ad36 is a shape file written in xml
app:stv_state_drawable="@drawable/circle_f9ad36"
// Use solid color as Drawable
app:stv_state_drawable="#000000"
أصبح أداء العرض أفضل بنسبة 30% على الأقل مما كان عليه في الماضي.
قم بترقية محرك تحميل الصور الافتراضي لدعم التخزين المؤقت الذكي. ربما لا يتعين عليك الآن تقديم مكتبة تحميل صور تابعة لجهة خارجية.
تم تصميم SuperTextView لمساعدة مطوري Android على تطوير تطبيقات Android بشكل أكثر كفاءة وسهولة وأناقة.
والآن تصاعدت النوايا الحسنة مرة أخرى. سيفتح SuperTextView الجديد المزيد من الإمكانيات لمطوري Android، وكما هو الحال دائمًا، سيوفر SuperTextView ميزات أكثر كفاءة.
يضيف هذا التحديث لـ SuperTextView إمكانية تلوين سحرية وقوية إلى StateDrawable . يمكن للمطورين تغيير لون الرمز بسهولة دون الحاجة إلى إضافة رمز لون مختلف إلى المشروع. ستمنح هذه التقنية تطبيقات Android الخاصة بك فرصة لتقليل حجمها.
# modify the drawable color
app:stv_state_drawable_tint="@color/gray"
# modify the drawable2 color
app:stv_state_drawable2_tint="@color/red"
باستخدام هذا السطر البسيط من التعليمات البرمجية، يمكنك منح الصورة القدرة على التغيير على الفور. أي لون تريده متروك لك بالطبع. كل هذا حدث دون الحاجة لتقديم صورة أخرى.
في كود Java، توجد وظيفة set / get المقابلة لها، بحيث يمكن للمطورين إلقاء السحر في أي وقت، وتغيير لون الصورة.
تتجاوز تحسينات StateDrawable مجرد تحويلات الألوان. تم منح SuperTextView القدرة على تغيير شكل StateDrawable. وبنفس الصورة، يمكن للمطورين الجمع بين عدد لا حصر له من الاحتمالات.
باستخدام بضعة أسطر من التعليمات البرمجية، يمكنك تحويل أي صورة كما يحلو لك.
# Modify the drawable's rotation
app:stv_state_drawable_rotate="90"
# Modify the drawable's rotation
app:stv_state_drawable2_rotate="90"
لا حاجة إلى تعليمات برمجية معقدة، SuperTextView بسيط وأنيق كما كان دائمًا.
وبالمثل، في كود Java، يتم توفير وظيفة set/get المقابلة أيضًا.
يمكن أن تساعد هذه القدرة المطورين بشكل فعال في ضغط حجم تطبيقات Android إلى أقصى الحدود.
هذا هو النص التدرج!
ربما يكون ما يقدمه SuperTextView هو الحل الأبسط والأنيق لتنفيذ النص المتدرج حتى الآن. من خلال تكوين بسيط، يمكنك تحقيق تأثيرات نصية متدرجة رائعة.
# Whether to enable gradient text
app:stv_textShaderEnable="true"
# Set the starting color of the text
app:stv_textShaderStartColor="@color/red"
# Set the ending color of the text
app:stv_textShaderEndColor="@color/yellow"
# Set the gradient mode of the text
# leftToRight：left -> right
# rightToLeft：right -> left
# topToBottom：top -> bottom
# bottomToTop：bottom -> top
app:stv_textShaderMode="leftToRight"
توفر هذه الخصائص أيضًا واجهة set/get في Java، مما يسهل على المطورين تعديلها في أي وقت.
أضاف الضابط وظيفتين جديدتين:
onAttach() : عندما يتم ضبط Adjuster على SuperTextView سيتم استدعاءه.onDetach() : عند إزالة الضابط من SuperTextView سيتم استدعاءه.من خلال إعادة كتابة هاتين الوظيفتين في Adjuster، يمكن للمطور إجراء تسجيل الحالة والتهيئة وإلغاء التسجيل وتحرير الموارد والعمليات الأخرى في الوقت المناسب.
public class MyAdjuster extends SuperTextView.Adjuster{
@Override
protected void adjust(SuperTextView superTextView, Canvas canvas) {
}
@Override
public void onAttach(SuperTextView stv) {
// will be called when the modifier is added to a SuperTextView
}
@Override
public void onDetach(SuperTextView stv) {
// will be called when the Adjuster is removed from SuperTextView
}
}
تسمح هذه الوظيفة للمطور بالحصول على جميع أدوات الضبط في SuperTextView . إذا لم يكن هناك أداة ضبط في SuperTextView ، فستعود فارغة.
جميع خصائص SuperTextView أصبحت الآن مسبوقة بـ stv_ .
يؤدي هذا إلى تجنب التعارضات مع أسماء الخصائص التي قد ينشئها SuperTextView عندما يقوم المطور بتقديم مكتبات خارجية أخرى.
إذا كان المطور يستخدم حاليًا إصدارًا سابقًا من SuperTextView ، فبعد الترقية إلى الإصدار الجديد، ستحتاج إلى إضافة بادئة للسمات في جميع ملفات XML بالبادئة stv_ .
app:corner="10dp"
Corner هو اسم السمة في الإصدار القديم. بعد الترقية إلى الإصدار الجديد، تحتاج إلى إضافة البادئة stv_ إلى المقدمة وتصبح stv_corner .
إذا كان المطور يستخدم AndroidStudio ، فافتح مربع حوار الاستبدال المجمع من Edit > Find > Replace واتبع الإرشادات أدناه.
إذا كان SuperTextView فقط يستخدم نفس مساحة الاسم (مثل app ) في مشروع المطور، فمن حسن الحظ، يمكنك ببساطة استبدال app: بـ app:stv_ .
بدءًا من SuperTextView v2.0، تم وضع علامة على وظيفة setAdjuster(Adjuster) لإزالة الحالة، وتم إضافة الوظيفة الجديدة addAdjuster(Adjuster) بدلاً من ذلك.
في الإصدار الجديد، ستتم إزالة وظيفة setAdjuster(Adjuster) رسميًا. إذا كان المطور قد استخدم هذه الطريقة من قبل، فيرجى تغييرها إلى addAdjuster(Adjuster) .
dependencies {
compile 'com.github.chenBingX:SuperTextView:v3.1.1'
}
اليوم، يحتوي SuperTextView على مجموعة من الميزات الشائعة مثل الشرائح، والحدود، والسكتات الدماغية، وتغير لون الضغط، والرسوم البيانية متعددة الحالات، ومؤامرات الشرائح، والضابط متعدد الاستخدامات، وتحميل الصورة الصافية، والمزيد. بفضل هذا، يمكن للمطورين بسهولة تحقيق مجموعة متنوعة من التأثيرات المرهقة للغاية، وتوفير الكثير من وقت التطوير، وتقليل تعقيد الصفحة بشكل فعال، وتقليل تكاليف صيانة المشروع.
اكتب الكود، ينبغي أن يكون ممتعًا جدًا!
منذ بضعة أشهر مضت، اقترح العديد من المطورين على CoorChice ما إذا كان من الممكن الحصول على SuperTextView مع القدرة على تحميل الصور الصافية. في الواقع، تم النظر في هذا أيضًا منذ وقت طويل لـ CoorChice ، ولكن في الأيام الأولى لـ SuperTextView ، لا يزال إتقان وظائفه الأساسية هو الهدف الأساسي، لذلك لم يشارك في الوظائف المتعلقة بالصور.
حتى الإصدار الكبير الأخير، SuperTextView v2.0، حاول CoorChie إضافة وظيفة عرض الصورة. وقد أدى ذلك إلى تمكين توسيع نطاق SuperTextView ، بالإضافة إلى القدرة على إضافة حدود وزوايا مستديرة ومخططات حالة إلى الصور. يمكن العثور على الوثائق ذات الصلة على الرابط التالي:
【مرحبًا، SuperTextView】 - https://www.jianshu.com/p/1b91e11e441d
هذه المرة، حصلت على استجابة جيدة من المطورين. يتطلع الجميع إلى استخدام SuperTextView لعرض الصورة ومعالجتها. بعد الإصدار الأخير، يبدو أن المطورين مهتمون أكثر بـ SuperTextView الذي يمكنه عرض الصورة على الإنترنت.
والآن، يعود SuperTextView الذي طال انتظاره!
لعرض صورة صافية، ما عليك سوى الكود التالي في SuperTextView :
SuperTextView stv_1 = (SuperTextView) findViewById(R.id.stv_1);
// fill in the picture Url
stv_1.setUrlImage(url);
التأثير هو نفس المثال الثاني لعرض الصورة الرمزية في الصورة أعلاه.
إذا كنت تريد عرض الصورة الصافية باعتبارها StateDrawable لـ SuperTextView ، فلا بأس.
// fill in the picture Url
stv_1.setUrlImage(url, false);
المعلمة الثانية خاطئة للإشارة إلى أن الصورة الصافية لن يتم ملؤها بـ SuperTextView بأكمله كخلفية، ولكن كمخطط حالة. وبطبيعة الحال، سيتم استخدام كل ما يتعلق بمخطط الحالة هنا. كما في المثال الأول أعلاه، تتم معالجة التخطيط بأكمله، بما في ذلك الصور والنص والخلفية، في SuperTextView ، ويتم وضع الصور التي تم تنزيلها من الشبكة على أنها StateDrawable في المكان.
SuperTextView من أجل الحفاظ على اعتماد المكتبة على النقاء وأصغر حجم ممكن، لا يوجد إطار تحميل صور مدمج. لذا افتراضيًا، سيتم استخدام محرك صور بسيط مدمج لتنزيل الصور، لضمان قدرة المطورين على استخدام القدرة على عرض الصورة على الإنترنت.
ومع ذلك، لا تزال CoorChice توصي المطورين باختيار إطار تحميل الصور المستخدم حاليًا، اعتمادًا على المشروع، وتعيينه على SuperTextView لتحميل الصورة. يتمتع SuperTextView بالقدرة على التكيف مع أي إطار عمل لتحميل الصور. سيوضح لك موقع CoorChice أدناه كيفية تثبيت إطار صورة موجود في SuperTextView باستخدام أمثلة Glide وPicasso.
في SuperTextView ، يتم تلخيص محرك تحميل الصور الأساسي في محرك الواجهة، ويحتاج المطور إلى تنفيذ محرك اعتمادًا على إطار الصورة المستخدم.
public class GlideEngine implements Engine {
private Context context;
public GlideEngine(Context context) {
this.context = context;
}
@Override
public void load(String url, final ImageEngine.Callback callback) {
Glide.with(context).load(url).into(new SimpleTarget<GlideDrawable>() {
@Override
public void onResourceReady(GlideDrawable resource, GlideAnimation<? super GlideDrawable> glideAnimation) {
// mainly through the callback return Drawable object to SuperTextView
callback.onCompleted(resource);
}
});
}
}
public class PicassoEngine implements Engine {
private Context context;
public PicassoEngine(Context context) {
this.context = context;
}
@Override
public void load(String url, final ImageEngine.Callback callback) {
Picasso.with(context).load(url).into(new Target() {
@Override
public void onBitmapLoaded(Bitmap bitmap, Picasso.LoadedFrom from) {
// mainly through the callback return Drawable object to SuperTextView
callback.onCompleted(new BitmapDrawable(Resources.getSystem(), bitmap));
}
@Override
public void onBitmapFailed(Drawable errorDrawable) {
}
@Override
public void onPrepareLoad(Drawable placeHolderDrawable) {
}
});
}
}
بعد تنفيذ المحرك ، الخطوة التالية هي تثبيته في SuperTextView .
يوصى بتثبيت CoorChice في onCreate() للتطبيق، بحيث عندما تحتاج إلى استخدام SuperTextView لتحميل وعرض الصورة على الشبكة، يمكنك استخدام إطار تحميل الصور ثلاثي الأطراف.
public class STVApplication extends Application {
@Override
public void onCreate() {
super.onCreate();
// 安装图片引擎
ImageEngine.install(new GlideEngine(this));
// ImageEngine.install(new PicassoEngine(this));
}
}
سطر واحد من التعليمات البرمجية لسهولة التثبيت.
تجدر الإشارة إلى أنه في أي وقت، سيحل مثيل المحرك المثبت بعد التثبيت دائمًا محل مثيل المحرك المثبت مسبقًا، أي أن SuperTextView يسمح فقط بوجود مثيل محرك واحد عالميًا.
يمكنك الآن جعل SuperTextView يقوم بتحميل الصورة باستخدام إطار تحميل الصور المحدد ثلاثي الأطراف.
dependencies {
compile 'com.github.chenBingX:SuperTextView:v3.0.0'
}
طوال الوقت، تتمتع CoorChice برؤية وتتوقع أن تكون قادرة على إنشاء مثل هذا التحكم: يمكنها تلبية معظم احتياجات التطوير الخاصة بك، وعرض النص، والصور، والهندسة، والرسوم المتحركة، والحالة، بحيث يمكنك استخدام عنصر التحكم لتحقيق أقصى قدر من الكفاءة من أعمال التطوير. إنه قوي جدًا، كما لو أنه يتمتع بعقلية، ويقبل مدخلاتك، ويقدم صورة مذهلة وفقًا لعقلك. ومع وصول الإصدار 2.0 من SuperTextView، أصبحنا نقترب خطوة واحدة من هذه الفكرة. الآن، تعال وانظر [SuperTextView v2.0]!
في [SuperTextView v2.0]، تمت إضافة دعم لعرض الصور. لكن الأمر لا يقتصر على عرض الصور فحسب، بل من الجيد أيضًا قص الصورة بالشكل المطلوب بناءً على مدخلاتك.
أضف زاوية مستديرة إلى الصورة، أو أضف حدًا، أو حولها مباشرة إلى دائرة. كل ما عليك فعله هو تعيين بعض الخصائص البسيطة التي تظهر على الفور أمام عينيك.
كيفية استخدام SuperTextView لعرض الصورة؟
ما عليك سوى إضافة السطرين التاليين من التعليمات البرمجية إلى ملف XML.
<com.coorchice.library.SuperTextView
...
app:stv_state_drawable="@drawable/avatar1"
app:stv_drawableAsBackground="true"
...
/>
إذا كنت مستخدمًا مخلصًا لـ SuperTextView ، فستجد أنه يمكن الآن استخدام state_drawable لعرض صورة.
الآن بعد أن أصبحت صورتك أمامك، ربما تريد أن تفعل شيئًا مختلفًا بشأنها، على سبيل المثال، إضافة زاوية مستديرة، أو أن تصبح دائرة مباشرة؟ لا توجد مشكلة، أصبح SuperTextView الآن مؤهلاً تمامًا لهذا النوع من العمل.
<com.coorchice.library.SuperTextView
android:layout_width="100dp"
android:layout_height="100dp"
...
app:stv_corner="15dp"
app:stv_state_drawable="@drawable/avatar1"
app:stv_drawableAsBackground="true"
...
/>
سهل جدا! على أساس الأصل، ما عليك سوى تعيين corner معقولة.
في بعض الأحيان قد تحتاج إلى استخدام حد لتغليف صورتك، كما في المثال أعلاه. هذا صحيح، وهذا بالتأكيد يقع ضمن نطاق قدرة SuperTextView .
<com.coorchice.library.SuperTextView
android:layout_width="100dp"
android:layout_height="100dp"
...
app:stv_corner="50dp"
app:stv_stroke_color="#F4E187"
app:stv_stroke_width="4dp"
app:stv_state_drawable="@drawable/avatar1"
app:stv_drawableAsBackground="true"
...
/>
يتحكم app:stv_stroke_color في لون الحدود، ويتحكم app:stv_stroke_width في عرض الحدود. كل شيء سلس للغاية، التحكم الذكي يجب أن يكون هكذا، أليس كذلك؟
في مواجهة التغيرات المعقدة في الطلب، أنجبت خاصية SuperTextView درجًا ثانيًا للتعامل مع هذا التعقيد.
state_drawable2 .
الآن، سيوضح لك CoorChice كيفية تنفيذ التأثيرين الموجودين في الصورة أعلاه.
<com.coorchice.library.SuperTextView
android:layout_width="100dp"
android:layout_height="100dp"
...
app:stv_corner="50dp"
app:stv_state_drawable="@drawable/avatar1"
app:stv_drawableAsBackground="true"
// The configuration of state_drawable2 starts here
app:stv_isShowState2="true"
app:stv_state_drawable2="@drawable/recousers"
app:stv_state_drawable2_mode="rightTop"
app:stv_state_drawable2_height="20dp"
app:stv_state_drawable2_width="20dp"
...
/>
<com.coorchice.library.SuperTextView
android:layout_width="100dp"
android:layout_height="100dp"
...
// background
android:background="@drawable/avatar7"
// The configuration of drawable1 starts here
app:stv_isShowState="true"
app:stv_state_drawable="@drawable/triangle"
app:stv_state_drawable_mode="leftTop"
app:stv_state_drawable_width="20dp"
app:stv_state_drawable_height="20dp"
// The configuration of state_drawable2 starts here
app:stv_isShowState2="true"
app:stv_state_drawable2="@drawable/recousers"
app:stv_state_drawable2_mode="rightTop"
app:stv_state_drawable2_height="20dp"
app:stv_state_drawable2_width="20dp"
...
/>
كما تعلم، تواصل state_drawable2 جميع العمليات السلسة للجيل الأول. في ظل الاستخدام الحكيم لجهازك الذكي، سوف يتمكن [SuperTextView] من التألق!
في السابق، جعل تصميم Adjuster [SuperTextView] روحًا وتحكمًا أكثر ذكاءً. يؤدي إدراج عملية الرسم، والتقاط أحداث اللمس، إلى تسهيل تغيير حالة عنصر التحكم من الخارج. الإبداع يبدأ من القلب ويصل إلى هنا.
الآن، يمكن لـ SuperTextView أن يحمل ما يصل إلى 3 Adjuster في نفس الوقت! ربما سيكون إبداعك أكثر إبهارًا.
في المثال أعلاه، تضيف CoorChice تأثيري الـ 【Sweep】 ومؤثرات الـ [Move] إلى خاصية SuperTextView، والنتيجة هي ما تراه.
المزيد من Adjuster يعني المزيد من المجموعات والمزيد من المفاجآت. في الإصدار 1.4.0، يستخدم CoorChice أيضًا Adjuster لتنفيذ وظيفة تغيير لون الضغط بسهولة.
هذا هو عصر Adjuster ، يمكنك استخدامه لتكون مبدعًا.
setAdjuster(Adjuster) الأصلية لا تزال محفوظة، ولكن ستتم إزالة الإصدارات المستقبلية ويجب عليك الترحيل في أقرب وقت ممكن. البديل الجديد هو addAdjuster(Adjuster) .
app:stv_shaderMode="leftToRight" التي تتحكم في وضع Shader. اليمين هو app:stv_shaderMode="leftTopRight" . إذا كنت تستخدم هذه الخاصية، برجاء تصحيحها بعد ترقية SuperTextView v2.0.set/getPressBgColor() و set/getPressTextColor() للتحكم في لون الخلفية في الكود. تحتاج فقط إلى تعيين هذه الخصائص في ملف xml مثل هذا:
# set the background color when you pressed
app:stv_pressBgColor="@color/red"
# set the text color when you pressed
app:stv_pressTextColor="@color/white"
getCorners() . يمكنك الحصول على معلومات حول الزوايا في SuperTextView ، وفي بعض الأحيان تريد حقًا استخدام هذه الطريقة. dependencies {
compile 'com.github.chenBingX:SuperTextView:v1.4'
}
mSuperTextView.setFrameRate(30);
// set 30 fps
لمسة وهي التغيير، لا يمكن إيقاف التخيل. أيها الفنان، العب بإبداعك!
يمكنك ضبط تأثير التظليل في ملف XML، ويمكنك ذلك.
app:stv_shaderEnable="true"
// set true to begin shader.
app:stv_shaderStartColor="@color/main_blue"
// set shader start color.
app:stv_shaderEndColor="@color/pink"
// set shader end color.
app:stv_shaderMode="rightToLeft"
// set shader mode. These are four mode：
// topTopBottom, bottomToTop, leftToRight, rightToLeft
بالطبع، يمكن تغيير هذه الخصائص عن طريق طريقة set/get . على سبيل المثال:
mSuperTextView.setShaderStartColor(Color.RED);
الآن، يتم توفير SuperTextView javadoc، يمكنك التنزيل من هنا (انقر فوق index.html للبدء): SuperTextView javadoc:http://ogemdlrap.bkt.clouddn.com/SuperTextView%E6%96%87%E6%A1%A3% 20.zip?attname=
كيفية استخدام SuperTextView 1.3 في build.gradle ：
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
dependencies {
compile 'com.github.chenBingX:SuperTextView:v1.3'
}
mSuperTextView.setAdjuster(new MoveEffectAdjuster())
.setAutoAdjust(true)
.startAnim();
يمكن تعيين خصائص SuperTextView في XML بسهولة، ويمكنك رؤية التأثير على الفور. تمامًا مثل استخدام TextView.
<SuperTextView
android:layout_width="50dp"
android:layout_height="50dp"
//Set Corner.
//If you want to get a circle, you just need to set the value of half of width.
app:stv_corner="25dp"
//Corner of left-top
app:stv_left_top_corner="true"
//Corner of right-top
app:stv_right_top_corner="true"
//Corner of left-bottom
app:stv_left_bottom_corner="true"
//Corner of right-bottom
app:stv_right_bottom_corner="true"
//Fill color
app:stv_solid="@color/red"
//Stroke color
app:stv_stroke_color="@color/black"
//Stroke width
app:stv_stroke_width="2dp"
//Set a state drawbale
//The default size is half of the SuperTextView.
app:stv_state_drawable="@drawable/emoji"
//The mode of the state drawable. Optional values:
// left、top、right、bottom、center(Default)、
//leftTop、rightTop、leftBottom、rightBottom、
//fill(Fill the SuperTextView. In this case, set state drawable size will not work.)
app:stv_state_drawable_mode="center"
//state drawable height
app:stv_state_drawable_height="30dp"
//state drawable width
app:stv_state_drawable_width="30dp"
//The padding of the left, it base on the value of state_drawable_mode.
app:stv_state_drawable_padding_left="10dp"
//The padding of the top, it base on the value of state_drawable_mode.
app:stv_state_drawable_padding_top="10dp"
//boolean. Whether to show the state drawble.
app:stv_isShowState="true"
//Whether to use the Stroke Text Function.
//Attention, Once you opne this function, setTextColor() will not work.
//That means you must to uses text_fill_color to set text color.
app:stv_text_stroke="true"
// Text stroke color. The default value is Color.BLACK.
app:stv_text_stroke_color="@color/black"
// Stroke text width.
app:stv_text_stroke_width="1dp"
// Stroke text color. The default value is Color.BLACK.
app:stv_text_fill_color="@color/blue"
//boolean. Whether to use the Adjuster Function.
//Use this function to do what you want to do.
//If open this function, but you haven't implemented your Adjuster, the DefaultAdjuster will be used.
//The DefaultAdjuster can auto adjust text size.
app:stv_autoAdjust="true"
/>
يمكن تعيين كافة السمات في Java. يمكنك أيضًا الحصول على قيمتها. على سبيل المثال:
mSuperTextView.setCorner(10);
mSuperTextView.getCorner();
عادةً ما يتعين عليك كتابة وإدارة الكثير من الملفات لتنفيذ تأثير المخطط أعلاه. ولكن الآن، يمكنك بسهولة القيام بذلك في ملف XML.
يختلف SuperTextView عن الركن العام، ويمكنه دعم التحكم الدقيق في موقع الركن. واحد، اثنان، ثلاثة، ما تريد.
استخدام نص السكتة الدماغية بهذه السهولة!
يختلف SuperTextView عن الحالة العامة القابلة للرسم، فهو يدعم خيارات تحكم أكثر دقة. يمكنك بسهولة تعيين الحالة القابلة للرسم، فقط لاستخدام سمة واحدة.
تم تصميم أداة الضبط لإدراج بعض الخيارات في عملية رسم SuperTextView . ولها معنى مهم جدا. على سبيل المثال، يمكن لـ DefaultAdjuster ضبط حجم النص تلقائيًا قبل رسم النص. وبطبيعة الحال، يمكنك استخدامه لفعل أي شيء.
إذا كنت تريد استخدام Adjuster، فيجب عليك استدعاء SuperTextView.setAutoAdjust(true) . بالطبع، يمكنك استدعاء SuperTextView.setAutoAdjust(false) لإيقافه في أي وقت. يجب عليك استدعاء هذه الطريقة بعناية. لأنه بمجرد استدعاء SuperTextView.setAutoAdjust(true) ، ولكنك لم تقم بتعيين الضابط الخاص بك من قبل، سيتم استخدام DefaultAdjuster على الفور. حتى تقوم بتعيين الضابط بنفسك.
لتنفيذ أداة ضبط، تحتاج إلى توسيع SuperTextView.Adjuster، وتنفيذ طريقة adjust(SuperTextView v, Canvas canvas) . سيتم استدعاء Adjuster.adjust() كلما حدث السحب، وهذا يعني أنه يمكنك التدخل في عملية الرسم في الخارج.
public class YourAdjuster extends SuperTextView.Adjuster {
@Override
protected void adjust(SuperTextView v, Canvas canvas) {
//do your business。
}
}
انتبه، إذا بدأت الرسوم المتحركة، يجب أن تكون حريصًا جدًا على كتابة الكود في أداة الضبط (). لأن الرسوم المتحركة سيتم رسمها بمعدل 60 إطارًا في الثانية. وهذا يعني أنه سيتم استدعاء هذه الطريقة 60 مرة في الثانية! لذا، لا تقم بإنشاء أي كائن جديد بهذه الطريقة. وإلا، فسيعاني تطبيقك من تأخير كبير! لأنه سيؤدي إلى تحطيم الذاكرة، وتحدث عملية GC بشكل متكرر. حول السبب التفصيلي، يمكنك الاطلاع على هاتين المقالتين:
إذا قمت بتجاوز طريقة onTouch(SuperTextView v, MotionEvent event) الخاصة بـ Adjuster، فستحصل على أحداث اللمس الخاصة بـ SuperTextView . من المهم جدًا الحصول على سلسلة من أحداث اللمس الخاصة بـ SuperTextView للتعامل معها. ويجب عليك إرجاع true في onTouch() ، وإلا فستحصل فقط على حدث ACTION_DOWN، وليس تدفق الأحداث.
public class YourAdjuster extends SuperTextView.Adjuster {
@Override
protected void adjust(SuperTextView v, Canvas canvas) {
//do your business。
}
@Override
public boolean onTouch(SuperTextView v, MotionEvent event) {
//you can get the touch event.
//If want to get a series of touch event, you must return true here.
}
}
نظرًا لأن SuperTextView هو الرسوم المتحركة المضمنة، يمكنك استخدام Adjuster لتنفيذ التأثير المذهل. كل ما عليك فعله هو استدعاء startAnim() و stopAnim() لبدء الرسوم المتحركة أو إيقافها بعد تدوين أداة الضبط.
كما ترون، تم تنفيذ هذا التأثير الجميل بواسطة Adjuster. يتيح لك تصميم البرنامج المساعد للسحب هذا استخدام أداة ضبط جديدة في SuperTextView في أي وقت. كل ما عليك فعله هو إنشاء أداة ضبط جديدة، ثم استدعاء setAdjuster() .
يأمل @Alex_Cin أن يرى تأثير Ripple Effect، لذلك في RippleAdjuster.java ، أوضحت كيفية استخدام Adjuster مع الرسوم المتحركة المدفوعة لتنفيذ Ripple Effect. 【رابط RippleAdjuster.java: https://github.com/chenBingX/SuperTextView/blob/master/app/src/main/java/com/coorchice/supertextview/SuperTextView/Adjuster/RippleAdjuster.java】
انظر، يمكنك تنفيذ تأثير Ripple الخاص بك.
الضابط جميل مصمم لوظيفة التسلسل الهرمي. يمكنك استدعاء Adjuster.setOpportunity(Opportunity opportunity) لتعيين التسلسل الهرمي لضابطك في SuperTextView .
في SuperTextView ، ينقسم التسلسل الهرمي من الأسفل إلى الأعلى إلى: التسلسل الهرمي للخلفية، التسلسل الهرمي القابل للرسم، التسلسل الهرمي للنص. يمكنك استخدام الفرصة لتعيين التسلسل الهرمي لضابطك إلى الطبقة التي تريدها.
public enum Opportunity {
BEFORE_DRAWABLE, //between backgournd layer and drawable layer
BEFORE_TEXT, //between drawable layer and text layer
AT_LAST //The top layer
}
مخطط الفرصة.
القيمة الافتراضية هي Opportunity.BEFORE_TEXT . مثل الرسم البياني الثاني.
في الواقع، SuperTextView يشبه اللوحة القماشية، ويمكنك رسم تصميمك عليها. إنه يفرض عليك الإنشاء، ولن تحتاج أبدًا إلى كتابة هذه التعليمات البرمجية عديمة الفائدة.
الآن يمكنك البدء في استخدام SuperTextView .
- إذا كنت تحب SuperTextView ، أشكرك على الذهاب إلى Github لإعطائي نجمة ؟ !
- بالإضافة إلى ذلك، ستقوم CoorChice أحيانًا بمشاركة البضائع الجافة على منصة المدونة، بما في ذلك التكنولوجيا ذات الصلة بنظام Android ، والتعلم الآلي ، والخوارزمية ، والتكنولوجيا الجديدة ، و** بعض الأفكار والأفكار حول التطوير والتحسين الشخصي**. انتقل إلى الصفحة الرئيسية الشخصية لـ CoorChice لتتمكن من متابعتي.
- مجموعة SuperTextView QQ: 775951525
Copyright 2017 CoorChice
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
