ONLYOFFICE Документи 1.3 для iOS: як влаштований мобільний редактор електронних таблиць

Сталося: ми випустили масштабне оновлення мобільного додатка ONLYOFFICE Документи під номером 1.3 для iOS пристроїв. Тепер в додатку з'явився редактор електронних таблиць для iPad, який вміє багато різного і корисного — майже все, що можна зробити в веб-версії. А ще додалася можливість підключення сторонніх сховищ Google Drive, Dropbox, OneDrive, Яндекс Диск і інших, що підтримують протокол WebDAV.

У цій статті ми розповімо докладніше про те, як влаштований редактор електронних таблиць.




Функціональність

Ось якими здібностями додаток ONLYOFFICE Документи наділяє своїх користувачів:

Керувати документами, збережених на порталах ONLYOFFICE та інших хмарних сервісах, підключених до ONLYOFFICE;

  • Редагувати текстові файли (iPhone, iPad);
  • Редагувати електронні таблиці (iPad);
  • Переглядати презентації і pdf файли.


Нам подобається наш текстовий редактор — повнофункціональний і дуже здібний. Ми навіть зняли про те, що він вміє, відео. Ось воно:



Редактор таблиць теж вміє чимало. Усіма об'єктами таблиці можна управляти. Текст у клітинках форматується, властивості комірок змінюються, формули, діаграми, автофігури — вставляються, самі таблиці експортуються та роздруковуються.



Далі розповімо про устрій цього редактора.

Анатомія редактора таблиць

Ми вже писали про пристрій нашого десктопного програми тут. В принципі, при розробці всіх наших редакторів документів ми дотримуємося однієї схеми. Вся бізнес-логіка формування даних створюється на javascript'e. У нас спільний код для вебу, десктопів і мобільних додатків, єдина їх відмінність — це висновок. На відміну від десктопів, у додатки під iOS — нативна відображення документа.

Ось загальна схема роботи програми:



Чому ми зробили власну рендеринг

По ідеї в нас був варіант зробити і обробку за аналогією з вебом, тобто використовувати WebView. Чому ми не зробили так:

1. Аналог Chrome для iOS використовувати не можна: Apple не дозволяє використовувати сторонні javascript движки.

2. Вбудований браузер дуже повільно працює з нашими редакторами. Це пов'язано з тим, що у всіх iOS пристроїв великий дозвіл екрану. Так як ми самі малюємо на Canvas всі документи, то для таких екранів нам треба малювати і прораховувати більше (приблизно в два рази). Результат — втрата продуктивності.

Загалом, ми зробили так: виділили з редактора рендеринг графіки, роботу з шрифтами і саме відображення документа в окремі нативні компоненти і перенесли їх на C++, залишивши ядро редакторів для прорахунку видимих областей і трекінгів. Завдяки цьому, ми можемо малювати необмежену кількість рядків, стовпців.

Поділити і розрахувати

На відміну від редактора документів, де ми знаємо фізичний розмір аркуша, таблиця безмежна. Ми не можемо створювати безмежну віртуальну текстуру. Щоб картинка отрисовывалась швидше, ми розбиваємо нашу потенційно безмежну таблицю на квадрати. Наприклад, сама таблиця може бути більше 100 тисяч рядків, але для користувача ми промальовуємо тільки область, потрібну йому в даний момент часу, — декілька квадратів з видимими областями (з невеликим запасом). Все інше розраховується по мірі необхідності і не малюється фізично до тих пір, поки це не знадобиться. За схожим принципом працюють, наприклад, Яндекс.Карти.

Схема:



Після відкриття документа видима область б'ється на квадрати розміром 1024x1024 пікселів. Кожен такий квадрат розраховується нашим javascript редактором. У процесі розрахунку документа з нативного коду береться інформація щодо шрифтів і йде набивання команд в масив. В результаті розрахунку видимого квадрата ми отримуємо масив команд для малювання (для прикладу — намалювати лінію, зафарбувати область, намалювати букву і т. д.). Далі команди растеризуются нативної графічною бібліотекою в битмапы. Потім вже в головному потоці відбувається оновлення або створення текстур OpenGL з цим битмапам аналогічного розміру. Все це виконується асинхронно (крім останнього пункту).

Підсумки

Ми зробили класне додаток, яке працює добре і підтримує більшу частину функцій веб-версії. Але на цьому розробка не зупиняється. Зараз йде робота над редактором електронних таблиць для iPhone. Ми також плануємо розширити можливості редактора електронний таблиць, а ще реалізувати затребувану функцію автозбереження.

Наше додаток доступний в App Store посилання. Для роботи з ним необхідний активний портал ONLYOFFICE. Якщо порталу немає, можна безкоштовно створити персональний офіс з допомогою самого додатка.

Джерело: Хабрахабр

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.