# Разное

В этой лекции будут свалены материалы, не вошедшие в другие лекции, но всплавшие при решении лабораторных работ

* [Всплывающие подсказки](#всплывающие-подсказки)
* [Сохранение CSV](#сохранение-csv)
* [Выбор из списка с возможностью редактирования](#выбор-из-списка-с-возможностью-редактирования)
* [Ввод даты или времени](#ввод-даты-или-времени)

<!-- TODO 
- контекстное меню 
- валидация полей
- маска ввода
- чекбокс
- размер файла
-->

## Всплывающие подсказки

Всплывающие подсказки, это блок с дополнительной информацией, появляющийся при наведении курсора на объект.

Можно реализовать двумя вариантами:

1. Подсказка **простой текст**: просто добавляем атрибут `ToolTip.Tip` к нашему визуальному элементу

    ```xml
    <Image
        ...
        ToolTip.Tip="Текст подсказки"/>
    ```

1. В подсказке хотите показать **сложную комбинацию** (картинка + описание, многострочный текст): добавляем к элементу вложенный тег

    ```xml
    <Image ...>

        <ToolTip.Tip>
            <StackPanel>
                <TextBlock Classes="h1">
                    ToolTip
                </TextBlock>
                <TextBlock Classes="h2">
                    A control which pops up a hint when a control is hovered
                </TextBlock>
            </StackPanel>
        </ToolTip.Tip>

    </Image>
    ```

Естественно вместо фиксированного текста можете сделать привязку (binding) к вычисляемому свойству класса.

## Сохранение CSV

Задача состоит из двух подзадач:

- вызов стандартного диалога сохранения для получения полного имени файла
- собственно сохранение данных

### Вызов стандартного диалога сохранения

```cs
// создание диалога и инициализация
var saveFileBox = new SaveFileDialog();
saveFileBox.Title = "Сохранить список мероприятий";
saveFileBox.InitialFileName = "events.csv"; 
var settingsFileName = await saveFileBox.ShowAsync(this);

// если выбор успешный, то в переменной имя целевого файла
if (settingsFileName != null) {
    // тут логика по сохранению данных
}
```

### Сохранение CSV

В принципе мы это [проходили на 2-м курсе](https://github.com/kolei/OAP/blob/master/articles/t5_file_types.md#CSV)

```cs
// тут копипаста из лекции
using (var writer = new StreamWriter(settingsFileName)){
    var enCulture = System.Globalization.CultureInfo.GetCultureInfo("en-US");

    //TODO тут вставить выбор всех мероприятий из БД и перебор в цикле
    
    // строковое поле выводим в кавычках
    // вместо фиксированных значений вставляем данные из модели  
    writer.WriteLine("{0},{1},\"{2}\"", 
        1,
        // дробные числа выводим с точкой
        2.0.ToString("0.00", enCulture),
        "qq");
}
```

## Выбор из списка с возможностью редактирования

Компонент **AutoCompleteBox** выглядит как текстовое поле, но при вводе данных показывает (и позволяет выбрать) варианты из списка:

```xml
<AutoCompleteBox 
    Name="autoCompleteBox"
    Text="{Binding #root.currentCity}"
    ItemsSource="{Binding #root.cityList}" />
```

* cityList - массив строк (либо делаем отдельный список названий городов, либо переопределяем toString)

При сохранении смотрим что введено в *autoCompleteBox.Text*, если название есть в списке городов, то сразу берем его `id`, если нет, то сначала добавляем город в базу, потом смотрим на его `id`

## Ввод даты или времени

### DatePicker

Для ввода даты можно использовать компонент **DatePicker** (есть еще **CalendarDatePicker**, но его я не копал):

```xml
<DatePicker 
    Name="datePicker"
    SelectedDate="{Binding #root.currentDate}"/>
```

Тип данных для атрибута *SelectedDate*: **DateTimeOffset**, поэтому напрямую поле БД ему скармливать нельзя.

Ниже пример для свойства класса окна

```cs
public DateTimeOffset currentDate { get; set; } = new DateTimeOffset( DateTime.Now);
```

вы можете при создании окна присвоить текущее значение даты этому свойству, или в вёрстке поменять на геттер *currentUser.bithDayDTO*. Где суффикс **DTO** означает, что это не оригинальное значение даты из базы, а преобразованное в **DateTimeOffset**. И не забыть при сохранении преобразовать обратно в дату.

### TimePicker

Для ввода времени можно использовать компонент **TimePicker** (как пользоваться раскопайте сами).