Компьютерапия

Приветствую читателей и гостей сайта Компьютерапия. Сегодня в который раз мы продолжим "мучать" по многочисленным просьбам наше приложение для android - расписание уроков для 11-6 классов.

Некоторое время тому назад я опубликовал статью и видео о преимуществах регистратора доменных имен Reg.ru и наглядно показал как сделать перенос WordPress сайта с локального компьютера на хостинг reg.ru.

Давайте сегодня сделаем апгрейт нашего приложения и научим его парсить веб страницы, заранее созданные, по определенным правилам, что бы у нас во фрагменты грузились данные с вебсайта по дням для каждого класса отдельно.

Проект в Android Studio

И сразу, пока не забыли, давайте в файл AndroidManifest.xml внесем пользовательские разрешения для работы с интернетом,

<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
<uses-permission android:name="android.permission.INTERNET"/>

иначе наше приложение и не стоит и пытаться написать.)))

В Android Studio будем использовать проект из предыдущего урока, полностью код с нуля писать не будем, сохраните проект под другим именем.

Для тех кто не знаком с проектом, вкратце пробежимся по его структуре. У нас две активности и пять фрагментов, первая активность обрабатывает нажатие на кнопки с номером класса, и передает параметр classId с номером класса. Вторая активность управляет созданием и отображением фрагментов. В коде фрагментов происходит загрузка данных, каждый фрагмент отвечает за конкретный день недели.

Если вы не знаете или забыли, как работать с фрагментами, то прочтите статью Создание фрагментов и использование вкладок для Android.

По сравнению с прошлым проектом, в первой активности изменений нет, единственное, что я изменил, это имя вызываемой через Intent второй активности. Во второй активности - в конструкции switch-case вписал полное имя пакета перед классом фрагмента. Почему? Потому-что Android Studio 3.0.1, капризная как не знаю кто...)))

Во фрагментах убраны переменные и классы, относящиеся к DatabaseHelper, и добавлены новые переменные

public Elements content;
public ArrayList<string> titleList = new ArrayList<string>();
private ArrayAdapter<string> adapter;

Переменная private ListView mList будет использоваться из прошлого урока, так как она связана с элементом ListView android:id="@+id/android:list" в каждом фрагменте, для отображения текста в TextView uroki файла item.xml.

Фрагмент получает параметр classId, который участвует в формировании и отображении данных. Как вы помните, fragment_main11 отвечает за данные понедельников, а classId отфильтровывает данные для каждого класса.

В onActivityCreated добавьте следующий код 

new NewTread().execute();
adapter  = new ArrayAdapter<string>(getActivity(),R.layout.item ,R.id.uroki, titleList);

(это асинхронный поток и текстовый адаптер, для связи со списком уроков) и под ней новый класс, действующий в фоновом режиме 

public class NewTread extends AsyncTask<String, Void, String>{
   @Override
   protected String doInBackground(String... arg){
     Document doc ;
        try{
            doc = Jsoup.connect("http://sitewordpress.maxfad.ru/raspisanie-urokov/"+classID+"-klass/"+classID+"-klass/").get();
            content=doc.select(".poned >li");
            titleList.clear();
            for (Element contents:content){
                  titleList.add(contents.text());
               }
           }catch (IOException e){
               e.printStackTrace();
           }
            return null;
   }
   @Override
    protected void onPostExecute(String result){
         mList.setAdapter(adapter);
  }
}

Подключаем библиотеку JSoup

В этом классе мы обращаемся к jar библиотеке JSoup, которую нужно скачать и добавить в папку libs вашего проекта. В любом поисковике наберите “jsoup for android”, скачайте по ссылке и поместите в проект. После этого библиотека будет видна в Android Studio. В зависимости в файле build.gradle добавлять ее не нужно, так как запись 

implementation fileTree(dir: 'libs', include: ['*.jar'])

 уже сама добавит любой jar файл в проект из папки libs.

А во фрагменте переменная doc типа Document, Jsoup делает подключение connect к адресу страницы, которую необходимо спарсить и в content из doc методом select выбирается класс poned элемента ul списка li. Для фрагмента, отвечающего за вторник в методе select будет такая запись: ".vtorn >li".

Наш тестовый сайт на WordPress

Для наглядности перейдем на сайт и посмотрим, как организовать страницы в WordPress. Надеюсь вы уже зарегистрировались в Reg.ru, купили домен и хостинг, установили на него WordPress, сделали свой сайт, и теперь нужно создать шесть страниц(11 класс, 10 класс и т.д.) для парсинга, со списком уроков по дням.

HTML код страниц

В html коде список выглядит вот так, h2 - заголовок дня на странице ul с классом дня недели и строки списка li.

О том, что такое списки в HTML, вы можете прочитать в статье Уроки HTML | Списки (ul, li, ol, dl, dt, dd).

<p> </p>
<h2>Понедельник</h2>
<ul class="poned">
<li>Обществознание</li>
<li>Химия</li>
<li>Математика</li>
<li>Биология</li>
<li>ОБЖ</li>
<li>ОБЖ</li>
</ul>
<p> </p>
<h2>Вторник</h2>
<ul class="vtorn">
<li>Математика</li>
<li>Химия</li>
<li>Математика</li>
<li>Английский язык</li>
<li>Обществознание</li>
<li>Биология</li>
</ul>
<p> </p>
<h2>Среда</h2>
<ul class="sreda">
<li>Физика</li>
<li>Биология</li>
<li>Химия</li>
<li>Литература</li>
<li>ОБЖ</li>
<li>Информатика</li>
</ul>
<p> </p>
<h2>Четверг</h2>
<ul class="chetv">
<li>Русский язык</li>
<li>Английский язык</li>
<li>ОБЖ</li>
<li>Информатика</li>
<li>Информатика</li>
<li>Химия</li>
</ul>
<p> </p>
<h2>Пятница</h2>
<ul class="pyatn">
<li>Физика</li>
<li>Литература</li>
<li>Литература</li>
<li>Английский язык</li>
<li>Музыка</li>
<li>Математика</li>
</ul>

Наше приложение будет ориентироваться на класс элемента ul, и во фрагмент будет загружаться только нужная информация.

Так расписание уроков выглядит на сайте, это поддомен моего сайта, все страницы и подкатегории я поместил в меню и с этих страниц данные будут парситься в наше приложение.

Вернемся в Android Studio, и я хочу напомнить что в пятом фрагменте будет использоваться класс "pyatn", отвечающий за пятничное расписание. Вы спросите, почему в адресе страницы два раза стоит classId? 

Jsoup.connect("http://sitewordpress.maxfad.ru/raspisanie-urokov/"+classID+"-klass/"+classID+"-klass/").get();

Потому что адрес страниц в WordPress и поддкатегорий содержит номер класса, меняя этот параметр, мы меняем адрес страницы, в зависимости от нажатой кнопки.

Если не создавать подкаталог для класса, а в sitewordpress.maxfad.ru /raspisanie-urokov/ поместить страницы сразу то запись можно было сократить. Так же в моем случае имя страницы получилось без расширения .html и заканчивается слешем "/". Если вы захотите использовать этот пример под свои нужды, то обратите на это внимание.

Далее происходит очищение titleList и в цикле происходит перебор элементов li, за конкретный день, и все они добавляются в titleList 

titleList.clear();
for (Element contents:content){
    titleList.add(contents.text());
}

и через onPostExecute данные попадают в адаптер а затем в ListView во фрагменте. 

mList.setAdapter(adapter);

Тест приложения в эмуляторе

Запустим наше приложение в эмуляторе, и нажав на любую кнопку класса (11-6) будет открыто расписание уроков по дням для данного класса. Нажимая на вкладки и меняя тем самым день недели, информация будет парситься с нашего тестового сайта.

Давайте проведем маленький эксперимент и выберем, например 9-класс, вторник и на сайте отредактируем страницу, что бы увидеть как будут происходить изменения в приложении. Изменим первый урок Математика, сделав два урока 2*Математика... ))) Нажмем на кнопку Обновить и перейдем на страницу сайта, обновив и там.

Выберем другой день недели в приложении и снова вернемся во Вторник(ВТ). Информация, увы не обновилась, или нужно больше времени, хотя если закрыть этот фрагмент и нажать на кнопку 9 класс, то во вторнике данные обновятся. Напишите в комментариях как можно улучшить код, что бы обновление происходило "на лету". Исправим текст как было раньше, Обновимся, в приложении выйдем и зайдем снова в 9 класс и данные опять совпадут с сайтом.

Еще раз покажу как устроены наши странички, делал html код в excel таблице, ссылка на скачивание "генератора расписания уроков" и архива с проектом будет доступна на сайте. Я создавал шесть страниц, на каждой странице по шесть уроков каждый день, с понедельника по пятницу включительно. Для каждого класса и каждого дня уроки отличаются, хотя и кое где повторяются. Но ведь это всего лишь пример!)))

Возможное развитие проекта

Однако, учитель, классный руководитель или директор школы, обладая простейшим навыком работы с компьютером, и умея работать с WordPress, может за 5 минут, с администраторской учеткой, внести необходимые изменения на странице, и в приложении расписание уроков будет централизованно обновлено.

Хотя данный пример охватывает только одну неделю, даже при таком функционале приложение вполне имеет право на жизнь. И этот пример вообще можно использовать не только в школе, а хоть для диеты, расписания автобусов, списков покупок, фильмов в кинотеатре, театре... Словом всюду, где не требуется менять данные очень часто.

А что бы сделать такое приложение, нужно всего лишь зарегистрироваться на сайте Reg.ru, купить домен и хостинг, создать свой сайт, написать приложение в Android Studio... и поделиться этим видео и статьей с друзьями)))

Архив с проектом приложения и Excel генератор кода расписания уроков в HTML можно скачать по этой ссылке.

Благодарю всех за поддержку, пишите в комментариях, что бы на ваш взгляд, можно было добавить или изменить в этом приложении, как еще можно использовать подобный пример, так же подписывайтесь на канал в YouTube, ставьте лайки, классы и до скорых встреч.

• Ютуб
• ВК видео
• Рутуб