From a3bd0cc3fe9e5df986bec7ff52b833b646f404dd Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=D0=9C=D0=BE=D1=80=D0=BE=D0=B7=D0=BE=D0=B2=20=D0=90=D0=BD?= =?UTF-8?q?=D0=B4=D1=80=D0=B5=D0=B9?= Date: Tue, 23 Nov 2021 12:53:52 +0000 Subject: [PATCH] =?UTF-8?q?=D0=97=D0=B0=D0=B3=D1=80=D1=83=D0=B7=D0=B8?= =?UTF-8?q?=D0=BB(=D0=B0)=20=D1=84=D0=B0=D0=B9=D0=BB=D1=8B=20=D0=B2=20'tex?= =?UTF-8?q?'?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- tex/example-work.tex | 110 +++++++++++++++++++++++++++++++++---------- tex/thesis.bib | 18 ++++++- 2 files changed, 103 insertions(+), 25 deletions(-) diff --git a/tex/example-work.tex b/tex/example-work.tex index 35ab388..28e31c0 100644 --- a/tex/example-work.tex +++ b/tex/example-work.tex @@ -23,7 +23,6 @@ \usepackage[cp1251]{inputenc} \usepackage{graphicx} \usepackage{minted} -\usepackage{spverbatim} \usepackage{float} \usepackage[sort,compress]{cite} @@ -116,7 +115,7 @@ % Раздел "Введение" \intro -Целью настоящей работы является изучение работы фреймворка для кроссплатформенной разработки "Flutter" и разработка приложения для создания графов и взаимодействия с ними. +Целью настоящей работы является изучение работы фреймворка для кроссплатформенной разработки ''Flutter'' и разработка приложения для создания графов и взаимодействия с ними. Поставлены задачи: \begin{itemize} @@ -134,7 +133,7 @@ \subsection{Основные определения} -\textbf{Ориентированный граф} определяется как пара \textit{(V, E)}, где \textit{V} --- конечное множество, а \textit{E} --- бинарное отношение на \textit{V}, т.~е. подмножество множества ${V \times V}$. Ориентированный граф для краткости называют \textbf{орграфом}. Множетсво $V$ называют \textbf{множеством вершин графа}, а его элемент называют \textbf{вершиной} графа. Множество $E$ называют \textbf{множеством рёбер}, а его элементы называют \textbf{рёбрами}. Граф может содержать \textbf{рёбра-циклы}, соединяющие вершину с собой. На рисунке~\ref{fig:orgrapf_example} изображен оринетированный граф с множеством вершин \{0, 1, 2, 3, 4\}.~\citenum{Algo_2013} +\textbf{Ориентированный граф} определяется как пара \textit{(V, E)}, где \textit{V} --- конечное множество, а \textit{E} --- бинарное отношение на \textit{V}, т.~е. подмножество множества ${V \times V}$. Ориентированный граф для краткости называют \textbf{орграфом}. Множество $V$ называют \textbf{множеством вершин графа}, а его элемент называют \textbf{вершиной} графа. Множество $E$ называют \textbf{множеством рёбер}, а его элементы называют \textbf{рёбрами}. Граф может содержать \textbf{рёбра-циклы}, соединяющие вершину с собой. На рисунке~\ref{fig:orgrapf_example} изображен ориентированный граф с множеством вершин \{0, 1, 2, 3, 4\}.~\citenum{Algo_2013} \begin{figure}[!ht] \centering @@ -155,7 +154,7 @@ Вершина \textit{v} \textbf{смежна} с вершиной \textit{u}, если в графе имеется ребро $\{u, v\}$. Для неориентированных графов отношение смежности является симметричным, но для ориентированных графов это не обязательно. -\textbf{Степенью} вершины в неориентированном графе называется число инцидентных ей рёбер. Для ориентированного графа различают исходящую степень, определяемую как число выходящих из неё рёбер, и входящую степень, определяемую как число входящих в неё рёбер. Сумма исходяшей и входящей степеней называется степенью вершины. +\textbf{Степенью} вершины в неориентированном графе называется число инцидентных ей рёбер. Для ориентированного графа различают исходящую степень, определяемую как число выходящих из неё рёбер, и входящую степень, определяемую как число входящих в неё рёбер. Сумма исходящей и входящей степеней называется степенью вершины. \textbf{Маршрутом} в графе называется конечная чередующаяся последовательность смежных вершин и ребер, соединяющих эти вершины. @@ -194,12 +193,12 @@ $$ V = \{a, b, c, d, e\} $$ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$ \subsubsection{Матрица смежности}\label{ref:smej} -Пусть $G$ --- граф с $n$ вершинами, пронумерованными числами от 1 до $n$. \textbf{Матрица смежности} --- это таблица с $n$ строками и $n$ столбцами, в которой элемент, стоящий на пересечении строки с номером $i$ и столбца с номером $j$, равен 1, еcли вершины с номерами $i$ и $j$ смежны, и 0, если они не смежны. +Пусть $G$ --- граф с $n$ вершинами, пронумерованными числами от 1 до $n$. \textbf{Матрица смежности} --- это таблица с $n$ строками и $n$ столбцами, в которой элемент, стоящий на пересечении строки с номером $i$ и столбца с номером $j$, равен 1, если вершины с номерами $i$ и $j$ смежны, и 0 в противоположном случае. \begin{table}[!ht] %\centering \caption{Пример матрицы смежности} - \begin{tabular}{|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|} + \begin{tabular}{|l|c|c|c|c|} \hline 0 & 1 & 1 & 0 & 1\\ \hline 1 & 0 & 1 & 1 & 0\\ \hline 1 & 1 & 0 & 0 & 1\\ @@ -211,12 +210,12 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$ \subsubsection{Матрица инцидентности}\label{ref:incident} -Пусть $G$ --- граф с вершинами, пронумерованными числами от 1 до $n$, и ребрами, пронумеровнными от 1 до $m$. В матрице инцидентности строки соответствуют вершинам, а столбцы рёбрам. На пересечении строки с номером $i$ и столбца с номером $j$ стоит 1, если вершина с номером $i$ инцидентна ребру с номером $j$, и 0 в противном случае. +Пусть $G$ --- граф с вершинами, пронумерованными числами от 1 до $n$, и ребрами, пронумерованными от 1 до $m$. В матрице инцидентности строки соответствуют вершинам, а столбцы рёбрам. На пересечении строки с номером $i$ и столбца с номером $j$ стоит 1, если вершина с номером $i$ инцидентна ребру с номером $j$, и 0 в противном случае. \begin{table}[!ht] %\centering \caption{Пример матрицы инцидентности} - \begin{tabular}{|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|p{15pt}|} + \begin{tabular}{|c|c|c|c|c|c|c|} \hline 1 & 1 & 1 & 0 & 0 & 0 & 0\\ \hline 1 & 0 & 0 & 1 & 1 & 0 & 0\\ \hline 0 & 1 & 0 & 1 & 0 & 1 & 0\\ @@ -229,8 +228,6 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$ \subsubsection{Списки смежности}\label{ref:spisok} Списки смежности часто используются для компьютерного представления графов. Для каждой вершины задается список всех смежных с ней вершин. В структурах данных, применяемых в программировании, списки смежности могут быть реализованы как массив линейных списков. -Указывается номер или имя вершины и перечисляются все смежные с ней вершины. - Пример: \begin{itemize} \item[1] : 2, 3, 5 @@ -240,18 +237,78 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$ \item[5] : 1, 3, 4 \end{itemize} +\subsection{Алгоритмы} +\subsubsection{Обход в ширину} +Поиск в ширину (обход в ширину, breadth-first search) --- один из основных алгоритмов на графах. + +Пусть задан граф $G = (V, E)$ и выделена исходная вершина $s$. Алгоритм поиска в ширину систематически обходит все ребра $G$ для «открытия» всех вершин, достижимых из $s$, вычисляя минимальное количество рёбер от $s$ s до каждой достижимой из $s$ вершины. + +Поиск в ширину имеет такое название потому, что в процессе обхода мы идём вширь, то есть перед тем как приступить к поиску вершин на расстоянии $k + 1$, выполняется обход вершин на расстоянии $k$~\cite{Algo_2013}. + +Приведенная ниже процедура поиска в ширину BFS предполагает, что входной граф $G = (V, E)$ представлен при помощи списков смежности. Псевдокод: +\inputminted[fontsize=\footnotesize, linenos]{python}{./dart/pseudoBFS.txt} + +Воспользуемся групповым анализом. Операции внесения в очередь и удаление из нее требует $O(1)$ времени. Следовательно на очередь потребуется $O(V)$ времени. Т.к. максимальная длина списков смежности $\theta(E)$, то время, необходимое для сканирования списков, равно $O(E)$. Расходы на инициализацию: $O(V)$. Таким образом, общее время работы алгоритма: $O(V + E)$. Время поиска в ширину линейно зависит от размера представления графа. + +\subsubsection{Обход в глубину} + + + + +\inputminted[fontsize=\footnotesize, linenos]{python}{./dart/pseudoDFS.txt} + \section{Инструменты} Рассмотрим используемый язык и библиотеку для отрисовки. \subsection{Dart} В качестве основы используется язык \textbf{Dart}, разработанный компанией Google, и широко используемый для кросс-платформенной разработки~\cite{dart_web}. -\subsection{Flutter} + Dart позиционируется в качестве замены/альтернативы JavaScript. Один из разработчиков языка Марк Миллер (Mark S. Miller) написал, что JavaScript «имеет фундаментальные изъяны»\cite{futureOfJavascript} («Javascript has fundamental flaws…»), которые невозможно исправить. + +Версия 1.0 вышла в 14 ноября 2013 года. +Вторая версия была выпущена в августе 2018 года. В языке появилась надежная система типов, т.~е. во время выполнении программы все переменные будут гарантированно указанному типу~\cite{dart_sound}. + +Пример HelloWorld на Dart: +\inputminted[fontsize=\footnotesize, linenos]{dart}{./dart/helloWorld.dart} + +Dart поддерживает сокращенную запись. Код примера HelloWorld можно записать так: +\inputminted[fontsize=\footnotesize, linenos]{dart}{./dart/hW.dart} + + +Концепты языка~\cite{dart_tour}: +\begin{itemize} + \item Все, что можно поместить в переменную, является объектом, а каждый объект является частью класса; + \item Dart -- язык со строгой типизацией, но объявления типов опциональны, т.к. поддерживается определение типа при компиляции; + \item В версии языка 2.12 появилась Null безопасность. Каждый объект не может быть Null, если не указано обратное; + \item поддерживаются дженерики; + \item для объявления локальных функций и переменных необходимо начать имя со знака ''\_'' +\end{itemize} +. + +\subsection{Flutter} +Для отрисовки информации используется фреймворк c открытым исходным кодом ''Flutter'', разработанный компанией Google. +Flutter не использует нативные компоненты для отрисовки интерфейса. В его основе лежит графический движок ''Skia'', написанный преимущественно на С++. +Skia --- библиотека для работы с 2D графикой с открытым исходным кодом, поддерживающая работу на большом количестве платформ~\cite{skia_docs} + +Первая версия выпущена в 2015 году под названием ''Sky'', работала только для Android-приложений. Основная заявленная особенность --- высокая графическая производительность (возможность отображения 120 кадров в секунду). Полная поддержка создания веб-приложений появилась в версии 2.0 (март 2021 года), также разрабатывается поддержка создания настольных приложений для Windows, macOS и Linux и Google Fuchsia. + +Простейший пример приложения с использованием Flutter: +\inputminted[fontsize=\footnotesize, linenos]{dart}{./dart/flutter.dart} +\begin{figure}[!ht] + \centering + \includegraphics[width=11cm]{./pic/flutter0.png} + \caption{\label{fig:flutter_example} + Простейшее приложение на Flutter} +\end{figure} \section{Реализация} -\subsection{Текст с формулами и леммой} +\subsection{Графы} +\subsubsection{Класс для вершины} +\subsubsection{Класс для графа} +\subsubsection{Алгоритмы} +\subsubsection{Кнопки} +\subsubsection{Отрисовка графа} -\subsection{Название другого подраздела} -\subsubsection{Более мелкий подраздел} -\subsubsection{Текст с таблицей} +\section{Таблица} +\subsection{Текст с таблицей} \begin{table}[!ht] \small @@ -278,17 +335,24 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$ \end{tabular} \end{table} -\subsubsection{Текст с кодом программы} - % Раздел "Заключение" \conclusion -В настоящей работы приведен пример оформления студенческой работы средствами системы \LaTeX. +Было разработано простое приложение для создания и работы с графами с использованием Dart и Flutter. -Показано, как можно оформить документ в соответствии: +В приложении возможно: \begin{itemize} - \item с правилами оформления курсовых и выпускных квалификационных работ, принятых в Саратовском государственном университете в 2012 году; - \item с правилами оформления титульного листа отчета о прохождении практики в соответствии со стандартом. + \item создать пустой граф; + \item добавить вершину; + \item удалить вершину; + \item добавить/изменить путь; + \item удалить путь; + \item сохранить граф; + \item загрузить граф; + \item построить минимальное остовное дерево с помощью алгоритма Крускала; + \item найти минимальный путь из выбранной вершины в другие с помощью алгоритма Дейкстры; + \item проверить доступность вершин с помощью обхода в глубину; + \item построить путь из одной вершины в другую с помощью обхода в ширину. \end{itemize} @@ -317,7 +381,7 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$ \inputminted[fontsize=\footnotesize, linenos]{dart}{./lib/pages/drawing_page.dart} \section{Код отрисовки графа}\label{painter} -Выводит на экран информацияю из графа. +Вывод на экран информации из графа. \inputminted[fontsize=\footnotesize, linenos]{dart}{./lib/src/curve_painter.dart} \section{Код класса для работы с графом}\label{graph} @@ -325,6 +389,4 @@ $$ E = \{(a, b), (a, c), (a, e), (b, c), (b, d), (c, e), (d, e)\}$$ \inputminted[fontsize=\footnotesize, linenos]{dart}{./lib/src/graph.dart} \noindent - - \end{document} diff --git a/tex/thesis.bib b/tex/thesis.bib index 7dfb03d..8671968 100644 --- a/tex/thesis.bib +++ b/tex/thesis.bib @@ -42,7 +42,23 @@ @TechReport{futureOfJavascript, title={Future of Javascript. [{Э}лектронное письмо]}, - note={URL:~\url{https://markmail.org/message/uro3jtoitlmq6x7t}} + note={URL:~\url{https://markmail.org/message/uro3jtoitlmq6x7t}}, + year={2010} +} + +@Manual{dart_sound, + title={The Dart type system. [{Э}лектронный ресурс]}, + note={URL:~\url{https://dart.dev/guides/language/type-system}(Дата обращения 20.11.2021). Загл. с экр. Яз. англ.}, +} + +@Manual{dart_tour, + title={A tour of the Dart language. [{Э}лектронный ресурс]}, + note={URL:~\url{https://dart.dev/guides/language/language-tour}(Дата обращения 20.11.2021). Загл. с экр. Яз. англ.}, +} + +@Manual{skia_docs, + title={Skia documentation. [{Э}лектронный ресурс]}, + note={URL:~\url{https://skia.org/docs/}(Дата обращения 20.11.2021). Загл. с экр. Яз. англ.}, } @Comment{jabref-meta: databaseType:bibtex;}