Поділитися через

Створення інтегрованих із SharePoint компонованих програм з нуля для перегляду, редагування, додавання та видалення елементів списку, створеному за допомогою Microsoft Lists

  • Стаття

У цій статті із сценарієм ви навчитеся створювати з нуля програми із функціональними можливостями форм SharePoint. У програмі буде продемонстровано, як можна переглядати, редагувати, додавати та видаляти елементи списку за допомогою компонованої програми, не відвідуючи сайт SharePoint.

Примітка

Додаткові відомості про різні сценарії роботи з формами SharePoint та більше прикладів ви можете знайти у статті Огляд сценаріїв SharePoint.

Вимоги

  • Щоб створювати списки й елементи списків, необхідно мати доступ до сайту SharePoint.
  • Ви маєте бути обізнані щодо створення та настройки списків.

Відомості про сценарій

Мета цього сценарію — показати, як можна створити компоновану програму для роботи із списком з нуля. Після завершення розгляду цього демонстраційного зразка ви зможете просто з компонованої програми, без необхідності відкривати список або його елементи, виконувати перелічені нижче завдання.

  • Перегляд усіх елементів у списку.
  • Пошук елементів у списку за текстовим значенням у певному стовпці.
  • Вибір елемента списку.
  • Редагування елемента списку.
  • Створення елемента списку.
  • Видалення елемента списку.

Сценарій — це ілюстрація основних можливостей компонованих програм, інтегрованих із SharePoint. Якщо ви бажаєте додати до макета додаткові екрани або вдосконалити зовнішній вигляд, ознайомтесь із переліченими нижче статтями.

Важливо

У прикладі для цього сценарію створюється зразок програми, здатної переглядати, редагувати, додавати та видаляти елементи списку. Ви можете застосувати персональний підхід й змінювати цю програму на власний розсуд та відповідно до потреб бізнесу. При настроюванні програми із застосуванням спеціальних імен елементів керування стежте за тим, щоб під час виконання кроків з нашого прикладу у формулах використовувалися правильні імена елементів керування.

Приклад

Цей приклад сценарію крок за кроком навчить вас, як створити програму та підключити її до списку, щоб переглядати, редагувати, додавати та видаляти елементи списку.

Крок 1 — Створення списку за допомогою Microsoft Lists

Створіть список із стовпцями та елементами списку. У цьому сценарії ми використали список із зазначеними нижче стовпцями та елементами списку.

Структура списку.

Примітка

Обидва стовпці належать до типу Один текстовий рядок.

Крок 2: створення компонованої програми з нуля

Створити пусту компоновану програму.

Крок 3: підключення програми до SharePoint

  1. Виберіть Джерела даних в області ліворуч.

    Виберіть джерела даних.

  2. Виберіть джерело даних SharePoint. Також можна виконати пошук за ім’ям в полі пошуку.

    Виберіть джерело даних SharePoint.

  3. Виберіть Додати підключення.

    Додавання підключення SharePoint.

  4. Виберіть тип підключення. Ви можете підключитися до SharePoint Online або до локального сайту SharePoint із шлюзом даних, якщо його налаштовано. Цей сценарій підключається до сайту SharePoint Online.

    Створити підключення SharePoint.

  5. Виберіть сайт SharePoint, де міститься створений раніше список.

    Виберіть сайт SharePoint.

  6. Виберіть список, створений вами. У цьому сценарії використовується список із іменем Фігури.

    Виберіть список.

  7. Виберіть Підключити. Джерело даних буде додано до програми.

    Додане джерело даних.

Крок 4 — Додавання таблиці даних для перегляду елементів списку

  1. Виберіть + (вставити) в області ліворуч.

    Виберіть "Вставити".

  2. Розгорніть Макет.

  3. Виберіть Таблиця даних.

    Виберіть таблицю даних.

  4. Виберіть ваше підключення SharePoint в якості джерела даних.

    Вибір джерела для таблиці даних.

  5. Перемістіть таблицю даних на екрані вправо вниз, щоб звільнити місце для додаткових компонентів.

    Перемістіть таблицю даних.

Крок 5: додавання пошуку та можливості вибрати елемент

  1. Вставте елемент керування Введення тексту на полотно та помістіть його під розкривним списком.

    Вставлення елемента керування для введення тексту.

  2. Оновіть властивість Default поля пошуку, вказавши значення Пошук за фігурою.

    Властивість Default (за замовчуванням) для введення тексту.

  3. Вставте елемент керування Поле зі списком на полотно та помістіть його під елементом керування для введення тексту, що ви його додали на попередньому кроці.

    Вставлення елемента керування «поле зі списком».

  4. У правій частині екрана Студії вкажіть у властивості Items поля зі списком список Форми, з яким ми працюємо у цьому прикладі.

    Елементи поля зі списком.

  5. Укажіть для цього прикладу значення властивості Value елемента керування «поле зі списком» як Форма замість значення Колір.

    Значення для поля зі списком.

  6. Оновіть значення властивості Items поля зі списком, яке було додано на попередньому кроці, і вкажіть наведену нижче формулу.

    Filter([@Shapes], StartsWith(Shape, TextInput1.Text))

    Властивість Items поля пошуку.

    У формулі використовуються такі функції:

    • Filter() — використовується в цій формулі для фільтрації елементів у полі зі списком відповідно до визначених параметрів. [@Shapes] у цій функції визначає джерело даних, яке потрібно відфільтрувати.
    • StartsWith() — використовується в цій формулі, щоб фільтрувати елементи списку за значеннями у стовпці Фігура, й відображати лише ті з них, що починаються з символів, введених в елементі керування TextInput1, який ми додали раніше.

Крок 6: додавання можливості редагування елементів

  1. Вставте елемент керування Редагування форми.

    Додавання редагування форми.

  2. У правій частині екрана Студії установіть для властивості Data source елемента редагування форми значення Фігури.

    Джерело даних редагування форми.

  3. Виберіть Редагувати поля у елементі керування редагування форми та видаліть усі інші поля, наприклад, Вкладення, якщо вони присутні.

    Видалення поля вкладень.

  4. Переконайтеся, що поля Фігура та Колір присутні. Якщо це не так, додайте їх за допомогою пункту Додати поле.

    Додавання полів «фігура» і «колір».

  5. Змініть порядок на екрані, щоб переконатися, що елемент керування Редагування форми видимий і не перекривається іншими елементами керування.

    Екран після зміні взаємного розташування елементів.

  6. Укажіть наведену нижче функцію для властивості OnSelect елемента керування «поле зі списком».

    Set(TextSelected,1)

    OnSelect для поля зі списком.

    Функція Set() задає для нової змінної із ім’ям TextSelected значення 1 при виборі якого-небудь значення у полі зі списком. Змінна TextSelected у цьому сценарії використовується як прапорець для керування діями та поведінкою можливостей додавання, редагування та видалення, як ми побачимо у розділах нижче.

  7. Укажіть вказану нижче формулу для властивості Item елемента керування «редагування форми».

    If(TextSelected=1,ListBox1.Selected,DataTable1.Selected)

    Властивість Item для редагування форми.

    Функція If() спочатку перевіряє, чи має змінна TextSelected значення 1, чи ні. Якщо це так, редагування форми відобразить вибраний у полі зі списком елемент. Якщо це не так, редагування форми відобразить вибраний елемент з таблиці даних.

  8. Вставте кнопку.

    Вставте кнопку.

  9. Праворуч у вікні Студії встановіть для властивості Text кнопки, яку ви додали на попередньому кроці, значення Зберегти.

    Кнопка «Зберегти».

  10. Настройте значення властивості OnSelect кнопки Зберегти, вказавши зазначену нижче формулу.

    SubmitForm(Form1);
Set(TextSelected,0)

    Властивість OnSelect кнопки «Зберегти».

    У формулі використовуються такі функції:

    • SubmitForm() — використовується в цій формулі для надсилання редагування форми та збереження значень до списку.
    • Set() — скидає значення змінної TextSelected на o, щоб у списку можна було вибрати новий елемент.

  11. Вставте елемент керування Текстовий підпис.

    Текстовий підпис.

  12. Оновіть властивість Text для елемента керування Текстовий підпис (котрий ви додали на попередньому кроці), вказавши значення Для редагування значень елемента виберіть елемент у таблиці або виконайте пошук.

    Оновлений текст підпису.

  13. Змініть взаємне розташування елементів на екрані, щоб упорядкувати елементи керування для редагування.

    Змініть взаємне розташування елементів керування.

Крок 7: додавання можливості створювати елементи

  1. Вставте кнопку.

  2. Змініть взаємне розташування елементів керування на екрані, щоб кнопка була видимою.

  3. Оновіть властивість Text кнопки, доданої на попередньому кроці, вказавши значення Додати.

  4. Настройте значення властивості OnSelect кнопки Додати, вказавши зазначену нижче функцію.

    NewForm(Form1)

    Властивість OnSelect кнопки «Додати».

    Функція NewForm() очищає елемент керування редагування форми, доданий на форму із іменем Form1, щоб користувач міг додати новий елемент списку.

Крок 8: додавання можливості видалення елементів

  1. Вставте кнопку.

  2. Розташуйте кнопку, що її було додано на попередньому кроці, нижче кнопки Зберегти.

  3. Оновіть властивість Text кнопки, доданої на попередньому кроці, вказавши значення Видалити.

  4. Настройте значення властивості OnSelect кнопки Видалити, вказавши зазначену нижче формулу.

    Remove([@Shapes], If(TextSelected=1,ListBox1.Selected,DataTable1.Selected));
Set(TextSelected,0)

    Властивість OnSelect кнопки «Видалити».

    У формулі використовуються такі функції:

    • Remove() — у цій формулі використовується для видалення вибраного елемента списку.
    • If() — спочатку перевіряє, чи має змінна TextSelected значення 1, чи ні. Якщо це так, функція Delete видаляє вибраний у полі зі списком елемент. Якщо це не так, функція Delete видаляє вибраний елемент у елементі керування «таблиця даних».
    • Set() — скидає значення змінної TextSelected на o, щоб у списку можна було вибрати новий елемент.

Тепер, коли всі компоненти програми налаштовано, переконайтеся, що ваш екран схожий на наведений нижче приклад.

Програма після додавання всіх компонентів.

Крок 9: збереження програми

Тепер, коли в програму додано можливість перегляду, редагування, додавання та видалення, збережіть програму.

  1. Виберіть меню Файл.

  2. Виберіть Зберегти.

  3. Якщо ви зберігаєте програму вперше, пункт Зберегти працюватиме як Зберегти як. Виберіть Зберегти, щоб зберегти програму у хмарі.

    Збережіть програму.

  4. Закрийте Power Apps Studio.

Крок 10: тестування програми

  1. Перейти до Power Apps.

  2. Виберіть Програми.

  3. Виберіть створену програму.

    Відтворіть програму.

  4. Протестуйте компоненти програми.

    Відтворення анімації програми.

    Підказка

    Ви можете швидко переглянути поведінку компонента, натиснувши клавішу Alt і клацнувши лівою кнопкою миші під час редагування програми в Power Apps Studio.

    Наприклад, замість того, щоб вибирати Попередній перегляд програми у правому верхньому кутку, або натискати на клавіатурі F5 для запуску програми у режимі попереднього перегляду, утримуйте клавішу Alt на клавіатурі і виберіть рядок з таблиці даних, щоб передати до елемента редагування форми вибраний рядок так, ніби програма працює в режимі попереднього перегляду.

    Alt + клацання лівою кнопкою миші в розкривному меню для попереднього перегляду.

    Крім того, утримуйте натиснутою клавішу Alt на клавіатурі, і тоді ви залишатиметесь у режимі попереднього перегляду в Power Apps Studio. Наприклад, можна вибрати кілька компонентів для різних дій або перевірок.

Наступні кроки

Якщо ви редагуєте додаток, то маєте опублікувати зміни, щоб їх могли бачити інші.

Коли програма буде готова до використання, надайте до неї спільний доступ.

Статті за темою:

Примітка

Розкажіть нам про свої уподобання щодо мови документації? Візьміть участь в короткому опитуванні. (зверніть увагу, що це опитування англійською мовою)

Проходження опитування займе близько семи хвилин. Персональні дані не збиратимуться (декларація про конфіденційність).