prs/prs.mobile/comal.timesheets/Tasks/AddEditTask.xaml

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="comal.timesheets.Tasks.AddEditTask"
             xmlns:material="clr-namespace:XF.Material.Forms.UI;assembly=XF.Material"
             material:MaterialNavigationPage.AppBarTitleTextFontSize="16.0"
              
             Title="Add/Edit Task">


    <ContentPage.Content>
        <Grid>
            <!--Outer Grid-->
            <Grid.RowDefinitions>
                <RowDefinition Height="*"/>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>

            <ScrollView Grid.Row="0" Padding="5" x:Name="pageScroller">
                <StackLayout Spacing="10">
                    <!--Inner StackLayout start-->

                    <Button  Text="Share" FontSize="Medium"  x:Name="shareBtn" Clicked="ShareBtn_Clicked" IsVisible="false"
                             HorizontalOptions="CenterAndExpand" Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold"/>

                    <!--Row 0 Title-->
                    <Label Text="Title:" FontSize="Medium" FontAttributes="Bold" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Editor x:Name="titleEdt"  AutoSize="TextChanges" TextChanged="TitleEdt_Changed" Placeholder="Edit Title" BackgroundColor="Transparent" />
                    </Frame>


                    <!--Row 1 Job No-->
                    <Label Text="Job No:" FontAttributes="Bold" FontSize="Medium"  Margin="5"  HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="auto"/>
                            </Grid.ColumnDefinitions>
                            <Label  x:Name="jobNoLbl" Grid.Column="0" FontSize="Medium" VerticalTextAlignment="Center" Text=""/>
                            <Button  Text="Select" FontSize="Medium"  x:Name="jobNoBtn" Clicked="JobNoBtn_Clicked" Grid.Column="1" HorizontalOptions="EndAndExpand" Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold"/>
                        </Grid>
                    </Frame>

                    <!--Row 2 Description/Summary-->
                    <Label Text="Description:" FontAttributes="Bold" FontSize="Medium"  Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center" MaxLines="1" HorizontalOptions="FillAndExpand"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Editor x:Name="descriptionEdt"  AutoSize="TextChanges" TextChanged="DescriptionEdt_Changed" VerticalOptions="FillAndExpand" Placeholder="Edit Description" BackgroundColor="Transparent"/>
                    </Frame>

                    <Label Text="Notes:" FontAttributes="Bold" FontSize="Medium"  Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center" MaxLines="1" HorizontalOptions="FillAndExpand"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <StackLayout>
                            <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                                <Label x:Name="existingNotesLbl"/>
                            </Frame>
                            <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                                <StackLayout>
                                    <Editor x:Name="notesEdt"  AutoSize="TextChanges" TextChanged="NotesEdt_TextChanged"
                                    VerticalOptions="FillAndExpand" Placeholder="Type notes here" BackgroundColor="Transparent"/>
                                    <Button Text="Add" FontSize="Medium" x:Name="addNotesBtn" Clicked="AddNotes_Clicked" IsEnabled="False"
                                    HorizontalOptions="CenterAndExpand" Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold" Margin="3"/>
                                </StackLayout>
                            </Frame>
                        </StackLayout>
                    </Frame>

                    <!--Row 3 Task Type-->
                    <Label Text="Task Type:"  FontAttributes="Bold" FontSize="Medium" Margin="5"  HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="auto"/>
                            </Grid.ColumnDefinitions>
                            <Label x:Name="taskTypeLbl" Grid.Column="0" VerticalTextAlignment="Center" FontSize="Medium"/>
                            <Button Text="Select" Grid.Column="1" FontSize="Medium" x:Name="taskTypeBtn" Clicked="TaskType_Clicked"  HorizontalOptions="EndAndExpand" Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold" Margin="3"/>
                        </Grid>
                    </Frame>

                    <!--Row 4 Start Date-->
                    <Label Text="Start Date: (tap date to edit)" FontAttributes="Bold" FontSize="Medium" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <DatePicker x:Name="startDatePck" DateSelected="StartDatePck_Selected" BackgroundColor="Transparent"/>
                    </Frame>

                    <!--Row 5 Estimated Time-->
                    <Label Text="Estimated Time:" FontAttributes="Bold" FontSize="Medium" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="auto"/>
                                <!--0-->
                                <ColumnDefinition Width="*"/>
                                <!--1-->
                                <ColumnDefinition Width="auto"/>
                                <!--2-->
                                <ColumnDefinition Width="auto"/>
                                <!--3-->
                                <ColumnDefinition Width="*"/>
                                <!--4-->
                                <ColumnDefinition Width="auto"/>
                                <!--5-->
                                <ColumnDefinition Width="auto"/>
                                <!--6-->
                            </Grid.ColumnDefinitions>
                            <Button Grid.Column="0" x:Name="decreaseBtn" Text="-" Clicked="DecreaseBtn_Clicked" Margin="0,0,5,0"  Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold" FontSize="Large" WidthRequest="45"/>
                            <Editor Grid.Column="1" x:Name="estimatedHoursEdt" FontSize="Medium" Keyboard="Numeric" TextChanged="EstimatedHoursEdt_Changed"/>
                            <Label Grid.Column="2" Text="Hrs" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="Medium"/>
                            <Label Grid.Column="3" WidthRequest="45"/>
                            <Editor Grid.Column="4" x:Name="estimatedMinsEdt" FontSize="Medium" Keyboard="Numeric" TextChanged="EstimatedMinsEdt_Changed"/>
                            <Label Grid.Column="5" Text="Mins" VerticalTextAlignment="Center" FontAttributes="Bold" FontSize="Medium"/>
                            <Button Grid.Column="6" x:Name="increaseBtn" Text="+" Clicked="IncreaseBtn_Clicked" Margin="5,0,0,0" Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold" FontSize="Large" WidthRequest="45"/>
                        </Grid>
                    </Frame>

                    <!--Row 6 Due Date-->
                    <Label Text="Due Date: (tap date to edit)" FontAttributes="Bold" FontSize="Medium" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <DatePicker x:Name="dueDatePck"  DateSelected="DueDatePck_Selected" BackgroundColor="Transparent"/>
                    </Frame>

                    <!--Row 7 Assigned To & Private Checkbox-->
                    <Grid>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="auto"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="auto"/>
                        </Grid.ColumnDefinitions>
                        <Label Text="Assigned To:" Grid.Column="0" FontAttributes="Bold" FontSize="Medium" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                        <Label  Text="Private" FontAttributes="Bold" Grid.Column="1" FontSize="Medium" VerticalTextAlignment="Center" HorizontalOptions="End" Margin="5"/>
                        <CheckBox x:Name="privateCheckBox" Grid.Column="2" HorizontalOptions="Start" CheckedChanged="CheckPrivateChanged"/>
                    </Grid>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="auto"/>
                            </Grid.ColumnDefinitions>
                            <Label  x:Name="assignedToLbl" Grid.Column="0" FontSize="Medium" VerticalTextAlignment="Center"/>
                            <Button Text="Select" FontSize="Medium" Grid.Column="1" x:Name="assignedToBtn" Clicked="AssignedToBtn_Clicked" HorizontalOptions="EndAndExpand"  Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold"/>
                        </Grid>
                    </Frame>

                    <!--Row 8 Allocated By-->
                    <Label Text="Allocated By:" FontAttributes="Bold" FontSize="Medium" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="auto"/>
                            </Grid.ColumnDefinitions>
                            <Label  x:Name="allocatedByLbl"  Grid.Column="0" FontSize="Medium" VerticalTextAlignment="Center"/>
                            <Button Text="Select" FontSize="Medium" Grid.Column="1" x:Name="allocatedByBtn" Clicked="AllocatedByBtn_Clicked" HorizontalOptions="EndAndExpand"  Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold" Margin="3"/>
                        </Grid>
                    </Frame>

                    <!--Row 9 Subscribers-->
                    <Label Text="Subscribers (Observers):" FontAttributes="Bold" FontSize="Medium" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="auto"/>
                                <RowDefinition Height="auto"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="*"/>
                            </Grid.ColumnDefinitions>
                            <Button Text="Add" FontSize="Medium" Grid.Column="0" Grid.Row="0" x:Name="addSubscriberBtn" Clicked="AddSubscriberBtn_Clicked" Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold"/>
                            <Button Text="Remove" FontSize="Medium" Grid.Column="1" Grid.Row="0" x:Name="removeSubscriberBtn" Clicked="RemoveSubscriberBtn_Clicked" Padding="3" TextColor="White" BackgroundColor="#15C7C1" FontAttributes="Bold"/>
                            <StackLayout x:Name="observerStackLayout" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2"/>
                        </Grid>

                    </Frame>


                    <!--Row 10 Category-->
                    <Label Text="Category: (tap to edit)" FontAttributes="Bold" FontSize="Medium" Margin="5" HorizontalTextAlignment="Start" VerticalTextAlignment="Center"/>
                    <Frame Padding="10" BorderColor="#15C7C1" CornerRadius="5">
                        <Picker x:Name="categoryPck" Title="Choose an Option" SelectedIndexChanged="category_Changed"   HorizontalOptions="FillAndExpand" BackgroundColor="Transparent">
                            <Picker.Items>
                                <x:String>To Do</x:String>
                                <x:String>In Progress</x:String>
                                <x:String>Waiting</x:String>
                                <x:String>Completed</x:String>
                            </Picker.Items>
                        </Picker>
                    </Frame>

                    <!--Row 11 Photo Frame-->
                    <Frame Padding="5" BorderColor="#15C7C1" Margin="2" CornerRadius="5" x:Name="photoFrame">
                        <StackLayout Orientation="Vertical">
                            <Label x:Name="photosLbl" Text="Photos" HorizontalOptions="Center" FontSize="Large" FontAttributes="Bold" Margin="5"/>
                            <ScrollView Orientation="Horizontal" x:Name="ImageScroller" IsVisible="false">
                                <StackLayout x:Name="images" Orientation="Horizontal" HeightRequest="150" HorizontalOptions="StartAndExpand" VerticalOptions="Fill"/>
                            </ScrollView>
                        </StackLayout>
                    </Frame>

                </StackLayout>
                <!--Inner StackLayout end-->
            </ScrollView>
            <!--ScrollView end-->

            <!--Fixed buttons for photos/QA forms-->
            <Frame Grid.Row="1" Padding="2" BorderColor="Black" Margin="5,0,5,30" BackgroundColor="#EBEBEB" CornerRadius="5">
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="50"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    <ImageButton x:Name="TakePhoto" Grid.Row="0" Grid.Column="0" Source="camera" Aspect="AspectFit" Clicked="TakePhoto_Clicked" CornerRadius="5" Margin="3" BorderColor="Black" BorderWidth="1" BackgroundColor="#15C7C1"/>
                    <ImageButton x:Name="ChooseImage" Grid.Row="0" Grid.Column="1" Source="photo" Aspect="AspectFit" Clicked="ChooseImage_Clicked" CornerRadius="5" Margin="3" BorderColor="Black" BorderWidth="1" BackgroundColor="#15C7C1"/>
                    <Button x:Name="formsBtn" Grid.Row="0" Grid.Column="2" Text="Forms"  FontSize="Large" Padding="3" FontAttributes="Bold" CornerRadius="5" Margin="3" BorderColor="Black" BorderWidth="1" BackgroundColor="#15C7C1" TextColor="White" Clicked="Forms_Clicked" IsEnabled="False"/>
                </Grid>
            </Frame>
        </Grid>
    </ContentPage.Content>
</ContentPage>