ماهي مكتبة scroll_highlight_text ؟
تتيح لك هذه الحزمة الجديدة الخاصة بفلتر إبراز النصوص والتمرير خلالها، وذلك سواءً للغات اللاتينية أو العربية. توفر الحزمة طريقة سهلة لعرض النصوص مع إمكانية تخصيص إبراز الكلمات ووظيفة التمرير الذكي.
ما الجديد في هذه الحزمة؟
دعم اللغة العربية: تمّ تحديث الحزمة لتعمل بشكل صحيح مع النصوص العربية.
إلغاء الحاجة إلى onChanged: لم تعد بحاجة إلى استخدام onChanged الخاصة بـ TextField لإبراز الكلمات المُطابقة للبحث.
سهولة الاستخدام: يمكنك الآن تمرير Controller الخاص بـ TextField إلى highlighted text scrollable Widget وسيتمّ إبراز الكلمات وتمرير الشاشة تلقائيًا.
كيف تعمل الحزمة؟
استخدم HighlightSearch Widget: قمّ بتغليف TextField الخاص بك بـ HighlightSearch Widget.
مرّر Controller الخاص بـ TextField: استخدم الخاصية controller لـ HighlightSearch Widget لمرور Controller الخاص بـ TextField.
استمتع بالبحث المميز! عند كتابة كلمة بحث، سيتمّ إبراز الكلمات المُطابقة تلقائيًا وتمرير الشاشة إلى أول كلمة مُطابقة.
تثبيت scroll_highlight_text
scroll_highlight_text: ^0.1.4
كود توضيحي لحزمة scroll_highlight_text
import 'package:flutter/material.dart';
import 'package:scroll_highlight_text/scroll_highlight_text.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({super.key});
@override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
final TextEditingController controller = TextEditingController();
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Scroll Highlight Text',
debugShowCheckedModeBanner: false,
theme: ThemeData(
colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
useMaterial3: true,
),
home: Scaffold(
body: Padding(
padding: const EdgeInsets.only(top: 16),
child: SafeArea(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16.0),
child: SearchBar(
hintText: 'Start search',
controller: controller,
),
),
HighlightedTextScrollable(
text: englishContent,
searchController: controller,
// Add this line if the text is Arabic.
// textDirection: TextDirection.rtl,
padding:
const EdgeInsets.symmetric(horizontal: 16, vertical: 20),
),
],
),
),
),
),
);
}
}
const String englishContent =
"""Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed vulputate auctor augue, vitae accumsan odio cursus a. Integer gravida luctus erat, id congue mi vehicula vel. Morbi at neque felis. In hac habitasse platea dictumst. Cras ultricies eros quis libero fringilla, eget convallis leo placerat. Vestibulum vitae odio sit amet lacus feugiat placerat. Nullam id consequat mauris. Maecenas vestibulum magna in vehicula tempor. Ut id dapibus mi. Donec at nisl risus. Quisque nec tortor sit amet nunc suscipit iaculis. Vivamus bibendum risus non magna gravida rutrum. Nulla facilisi. Sed hendrerit eget enim at eleifend.
Phasellus at purus ac risus lobortis cursus. Vestibulum bibendum auctor massa sit amet blandit. Sed vel tincidunt est. Vivamus tempor diam vel tortor posuere, eget fermentum arcu tempor. Fusce nec eleifend turpis. Nullam auctor convallis fringilla. Sed id erat velit. Integer pretium ex a nisi vehicula, id euismod sem cursus. Mauris congue massa magna, ut rutrum ipsum dictum non. Integer nec libero a velit dapibus aliquam. Proin blandit ultricies nisi, eget auctor urna cursus ac. Vestibulum euismod augue nec ex ultricies, ac vestibulum lacus mattis. Suspendisse commodo metus ut semper laoreet. Duis tincidunt mauris et risus feugiat, non posuere arcu congue. Donec id arcu nec mauris pharetra ultricies nec in justo.
""";
const String arabicContent = """ ## تأثير التكنولوجيا في الرياضة الحديثة
