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


Настройка внешнего вида экрана

В этом уроке будет рассмотрено изменение макета и внешнего вида экрана в LightSwitch.

Настройка экрана

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

Просмотр экрана

  1. В Обозревателе решений дважды щелкните по узлу экрана OrdersByCustomers.

  2. Нажмите клавишу F5 для запуска приложения, затем в меню навигации выберите команду Заказы по клиентам для отображения формы.

    При выборе клиента в расположенном слева списке Customers справа будут отображаться сведения о клиенте и список связанных с ним заказов.

  3. Нажмите кнопку Закрыть в правом верхнем углу окна приложения, чтобы закрыть его.

Изменение отображаемых имен

  1. В центральной области конструктора экрана выберите верхний узел Макет столбцов | Заказы по клиентам.

  2. В окне Свойства выберите поле Описание и введите текст Выберите клиента для просмотра заказов.

    Ввод описания

    Это сообщение будет отображаться как всплывающая подсказка на экране при запуске приложения.

  3. Нажмите клавишу F5 для запуска приложения, а затем в меню навигации выберите команду Заказы по клиентам для отображения экрана.Для отображения всплывающей подсказки наведите указатель мыши на элемент «Заказы по клиентам» на вкладке экрана и задержите его на некоторое время.

  4. Нажмите кнопку Закрыть в правом верхнем углу окна приложения, чтобы закрыть его.

Изменение элементов управления и порядка отображения

  1. В узле Макет - строки | Столбец сведений выберите узел Компания.

    Изменение типа элемента управления

  2. В раскрывающемся списке выберите Метка.

    Таким образом будет запрещено изменение поля Company в работающем приложении.

  3. Выберите узел Телефон.

  4. Перетащите его в узел Компания.

    Таким образом изменится порядок отображения полей на экране.

  5. Нажмите клавишу F5 для запуска приложения, затем в меню навигации выберите команду Заказы по клиентам для отображения экрана и проверки изменений.

  6. Нажмите кнопку Закрыть в правом верхнем углу окна приложения, чтобы закрыть его.

Отключение команд для сетки данных

  1. Разверните узел DataGrid | Orders.

  2. Если узел Панель команд не развернут, разверните его.

  3. Выберите узел Изменить….В окне Свойства снимите флаг IsVisible.

    Отключение кнопки "Изменить"

    Это приведет к отключению команды Изменить для набора данных Orders.

  4. Повторите эту процедуру для узла Delete.

  5. Нажмите клавишу F5 для запуска приложения, затем в меню навигации выберите команду Orders By Customers для отображения экрана и проверки изменений.

    Обратите внимание, что кнопки Изменить и Удалить отсутствуют.

  6. Нажмите кнопку Закрыть в правом верхнем углу окна приложения, чтобы закрыть его.

Назначение экрану атрибута «только для чтения»

  1. Разверните узел DataGrid | Orders.

  2. Разверните узел Панель команд.

  3. Выберите узел Добавить…, а затем на Ленте панели инструментов нажмите кнопку Удалить.

  4. Выберите узел DataGrid | Orders и затем Data Grid Row | Order.

  5. В окне Свойства установите флажок Использовать элементы управления только для чтения.

    Таким образом будет запрещено изменение данных в наборе пользователями.

  6. Нажмите клавишу F5 для запуска приложения, затем в меню навигации выберите команду Заказы по клиентам для отображения экрана и проверки изменений.

    Обратите внимание, что кнопка Add отсутствует, и изменение данных в сетке невозможно.

  7. Нажмите кнопку Закрыть в правом верхнем углу окна приложения, чтобы закрыть его.

Подробный обзор

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

В значении атрибута Описание можно указать справочные данные для конечного пользователя.Обратите внимание, что в рамках предыдущих занятий свойство Описание для поля ContactName изменялось в Конструкторе сущностей.Если значение атрибута Описание задается в Конструкторе сущностей, то это изменение распространяется на все экраны; если же оно задается в Конструкторе экрана, то изменения распространяются только на текущий экран, с которым вы работаете.

Если тип элемента управления для поля Компания был изменен с TextBox на Label, то можно заметить, что в список доступных элементов управления для каждого поля будут включены только те элементы управления, которые соответствуют базовому типу данных этого поля.Например, для поля Text можно выбрать тип TextBox или Label.Если было установлено расширение, которое включает в себя элемент управления для отображения Text, то этот элемент управления также будет отображаться в списке.Расширения описываются в рамках другого занятия.

Помимо перетаскивания поля в другое место в списке, например в списке Customers, можно также перетаскивать поля с левой панели Конструктора экрана на центральную панель.Например, если поле City было случайно удалено, можно перетащить его обратно из узла Customers на левой панели.

Если команды Edit и Delete в сетке Orders отключены, заказы можно по-прежнему изменять и удалять непосредственно в наборе.Для решения этой проблемы позднее набор Orders определяется как доступный только для чтения с помощью свойства Использовать элементы управления только для чтения.Свойство Использовать элементы управления только для чтения влияет на все нижестоящие узлы в элементе Дерево содержимого экрана.Например, если задать значение свойства Использовать элементы управления только для чтения для узла верхнего уровня Grid | Orders by Customers, весь экран будет доступен только для чтения.

ПримечаниеПримечание

Если свойство Использовать элементы управления только для чтения установлено, команды Add, Edit и Delete не отключаются.Если эти команды включены, пользователи по-прежнему могут изменять данные.

Следующие шаги

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

Следующее занятие: Добавление локального свойства

См. также

Задачи

Практическое руководство. Создание экрана Silverlight

Пошаговое руководство. Проектирование экрана

Другие ресурсы

Создание экранов

Экраны: пользовательский интерфейс приложения