prs/prs.mobile.new/PRS.Mobile/Modules/Requisitions/Edit/Views/Items/RequisitionItemScanner.xaml

<?xml version="1.0" encoding="utf-8"?>

<mobile:MobilePage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:mobile="clr-namespace:InABox.Mobile;assembly=InABox.Mobile.Shared"
             xmlns:local="clr-namespace:PRS.Mobile;assembly=PRS.Mobile"
             xmlns:views="http://xamarin.com/schemas/2020/toolkit"
             xmlns:forms="clr-namespace:ZXing.Net.Mobile.Forms;assembly=ZXing.Net.Mobile.Forms"
             x:Class="PRS.Mobile.RequisitionItemScanner"
             Title="Edit Picking List Item">
    
    <mobile:MobilePage.BindingContext>
        <local:RequisitionItemScannerViewModel x:Name="_viewModel"/>
    </mobile:MobilePage.BindingContext>
    
    <mobile:MobilePage.Resources>
        <local:RequisitionItemScannerHoldingMatchConverter x:Key="HoldingMatchConverter" x:Name="HoldingMatchConverter" />
        <mobile:ByteArrayToImageSourceConverter x:Key="ByteArrayToImageSourceConverter"/>
        <mobile:StringWithDefaultValueConverter x:Key="DefaultToGeneralStock" Default="(General Stock)" />
        <mobile:DoubleCalculator x:Key="ScannerHeightCalculator" Type="Product" Constants="0.65"/>
        
        <DataTemplate x:Key="_locationTemplate" x:Name="_locationTemplate" x:DataType="local:StockHoldingShell">
            <ViewCell>
                 <mobile:MobileCard
                    HeightRequest="50"
                    IsClickable="True"
                    Clicked="SelectFromHolding_Click"
                    Margin="0,0,0,5"
                    Padding="5,0,0,0"
                    BackgroundColor="{StaticResource Theme.Surface}">
                    <Grid RowSpacing="0" ColumnSpacing="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="50"/>
                            <ColumnDefinition Width="5"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="1"/>
                            <ColumnDefinition Width="50"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="20"/>
                            <RowDefinition Height="15"/>
                            <RowDefinition Height="15"/>
                        </Grid.RowDefinitions>
                        
                        <Image
                            Grid.Row="0"
                            Grid.Column="0"
                            Grid.RowSpan="3"
                            Margin="0,0,0,0"
                            Source="{Binding Image, Converter={StaticResource ByteArrayToImageSourceConverter}}"/>
                        
                        <BoxView Grid.Row="0" Grid.RowSpan="3" Grid.Column="1" BackgroundColor="Gray" WidthRequest="1" HorizontalOptions="Start"/>

                        <Label 
                            Grid.Row="0"
                            Grid.Column="2"
                            views:DockLayout.Dock="Left"
                            FontSize="{StaticResource Theme.Text.Small.Size}"
                            TextColor="{StaticResource Theme.OnSurface}"
                            VerticalTextAlignment="Center"
                            Text="{Binding ProductName}"/>
                        
                        <views:DockLayout
                            Grid.Row="1"
                            Grid.Column="2">
                            <Label 
                                views:DockLayout.Dock="Left"
                                FontSize="{StaticResource Theme.Text.Micro.Size}"
                                TextColor="{StaticResource Theme.OnSurface}"
                                VerticalTextAlignment="Center"
                                Text="{Binding DimensionsUnitSize}"/>
                            <Label 
                                views:DockLayout.Dock="Left"
                                FontSize="{StaticResource Theme.Text.Micro.Size}"
                                TextColor="{StaticResource Theme.OnSurface}"
                                Margin="5,0,0,0"
                                VerticalTextAlignment="Center"
                                Text="{Binding StyleDescription}"/>
                        </views:DockLayout>
                        
                        <Label 
                            Grid.Row="2"
                            Grid.Column="2"
                            FontSize="{StaticResource Theme.Text.Micro.Size}"
                            TextColor="{StaticResource Theme.OnSurface}"
                            VerticalTextAlignment="Center"
                            Text="{Binding JobDisplay, Converter={StaticResource DefaultToGeneralStock}}"/>

                        <BoxView Grid.Row="0" Grid.RowSpan="3" Grid.Column="3" BackgroundColor="Gray"/>
                        
                        <Label 
                            Grid.Row="0"
                            Grid.RowSpan="3"
                            Grid.Column="4"
                            FontSize="{StaticResource Theme.Text.Header.Size}"
                            TextColor="{StaticResource Theme.OnSurface}"
                            VerticalTextAlignment="Center"
                            HorizontalTextAlignment="Center"
                            Text="{Binding Units}"/>
                        
                    </Grid>
                </mobile:MobileCard>
           </ViewCell>
        </DataTemplate>
        
        <DataTemplate x:Key="_productTemplate" x:Name="_productTemplate" x:DataType="local:StockHoldingShell">
            <ViewCell>
                <mobile:MobileCard
                    HeightRequest="50"
                    IsClickable="True"
                    Clicked="SelectFromHolding_Click"
                    Margin="0,0,0,5"
                    Padding="5,0,0,0"
                    BackgroundColor="{Binding ., Converter={StaticResource HoldingMatchConverter}}">
                    <Grid RowSpacing="0" ColumnSpacing="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="50"/>
                            <ColumnDefinition Width="5"/>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="1"/>
                            <ColumnDefinition Width="50"/>
                        </Grid.ColumnDefinitions>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="20"/>
                            <RowDefinition Height="15"/>
                            <RowDefinition Height="15"/>
                        </Grid.RowDefinitions>
                        
                        <Image
                            Grid.Row="0"
                            Grid.Column="0"
                            Grid.RowSpan="3"
                            Margin="0,0,0,0"
                            Source="{Binding Image, Converter={StaticResource ByteArrayToImageSourceConverter}}"/>

                        <BoxView Grid.Row="0" Grid.RowSpan="3" Grid.Column="1" BackgroundColor="Gray" WidthRequest="1" HorizontalOptions="Start"/>
                        
                        <views:DockLayout
                            Grid.Row="0"
                            Grid.Column="2">
                            <Label 
                                views:DockLayout.Dock="Left"
                                FontSize="{StaticResource Theme.Text.Small.Size}"
                                TextColor="{StaticResource Theme.OnSurface}"
                                VerticalTextAlignment="Center"
                                Text="{Binding LocationCode}"/>
                            <Label 
                                views:DockLayout.Dock="Left"
                                FontSize="{StaticResource Theme.Text.Small.Size}"
                                TextColor="{StaticResource Theme.OnSurface}"
                                VerticalTextAlignment="Center"
                                Margin="5,0,0,0"
                                Text="{Binding LocationDescription, StringFormat=': {0}'}"/>
                        </views:DockLayout>
                        
                        <views:DockLayout
                            Grid.Row="1"
                            Grid.Column="2">
                            <Label 
                                views:DockLayout.Dock="Left"
                                FontSize="{StaticResource Theme.Text.Micro.Size}"
                                TextColor="{StaticResource Theme.OnSurface}"
                                VerticalTextAlignment="Center"
                                Text="{Binding DimensionsUnitSize}"/>
                            <Label 
                                views:DockLayout.Dock="Left"
                                FontSize="{StaticResource Theme.Text.Micro.Size}"
                                TextColor="{StaticResource Theme.OnSurface}"
                                Margin="5,0,0,0"
                                VerticalTextAlignment="Center"
                                Text="{Binding StyleDescription}"/>
                        </views:DockLayout>
                        
                        <Label 
                            Grid.Row="2"
                            Grid.Column="2"
                            FontSize="{StaticResource Theme.Text.Micro.Size}"
                            TextColor="{StaticResource Theme.OnSurface}"
                            VerticalTextAlignment="Center"
                            Text="{Binding JobDisplay, Converter={StaticResource DefaultToGeneralStock}}"/>

                        <BoxView Grid.Row="0" Grid.RowSpan="3" Grid.Column="3" BackgroundColor="Gray"/>
                        
                        <Label 
                            Grid.Row="0"
                            Grid.RowSpan="3"
                            Grid.Column="4"
                            FontSize="{StaticResource Theme.Text.Header.Size}"
                            TextColor="{StaticResource Theme.OnSurface}"
                            VerticalTextAlignment="Center"
                            HorizontalTextAlignment="Center"
                            Text="{Binding Units}"/>
                        
                    </Grid>
                </mobile:MobileCard>
            </ViewCell>
        </DataTemplate>
        
    </mobile:MobilePage.Resources>
    
    <mobile:MobilePage.PrimaryMenu>
        <mobile:MobileMenuButton Image="tick" IsVisible="{Binding HasSaveArgs}" Clicked="SaveItem_Clicked"/> 
    </mobile:MobilePage.PrimaryMenu>
    
    <mobile:MobilePage.PageContent>
        <views:DockLayout Margin="5">
            
            <mobile:MobileCard 
                Padding="0" 
                IsClippedToBounds="True" 
                views:DockLayout.Dock="Top">
                <mobile:MobileCard.HeightRequest>
                    <MultiBinding Converter="{StaticResource ScannerHeightCalculator}">
                        <Binding Source="{RelativeSource AncestorType={x:Type local:RequisitionItemScanner}}" Path="Width" />
                    </MultiBinding>
                </mobile:MobileCard.HeightRequest>

                <Grid x:Name="scannerGrid">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="21"/>
                        <RowDefinition Height="4*"/>
                        <RowDefinition Height="21"/>
                        <RowDefinition Height="*"/>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="21"/>
                        <ColumnDefinition Width="4*"/>
                        <ColumnDefinition Width="21"/>
                        <ColumnDefinition Width="*"/>
                    </Grid.ColumnDefinitions>
                    
                    <forms:ZXingScannerView  
                        Grid.Row="0" 
                        Grid.Column="0" 
                        Grid.RowSpan="5" 
                        Grid.ColumnSpan="5" 
                        x:Name="_scanView" 
                        Background="Gray"
                        OnScanResult="ScanView_OnScanResult"/>
                    
                    <Polyline Points="20,00 00,00 00,20" Grid.Row="1" Grid.Column="1" x:Name="topleft" Stroke="Red" StrokeThickness="2"/>
                    <Polyline Points="00,00 20,00 20,20" Grid.Row="1" Grid.Column="3" x:Name="topright" Stroke="Red"  StrokeThickness="2"/>
                    <Polyline Points="20,00 20,20 00,20" Grid.Row="3" Grid.Column="3" x:Name="bottomright" Stroke="Red"  StrokeThickness="2"/>
                    <Polyline Points="20,20 00,20 00,00" Grid.Row="3" Grid.Column="1" x:Name="bottomleft" Stroke="Red"  StrokeThickness="2"/>
                    
                    <Label 
                        Text="Scan Barcode" 
                        TextColor="White" 
                        BackgroundColor="Transparent" 
                        Grid.Row="4" 
                        Grid.Column="0" 
                        Grid.ColumnSpan="5" 
                        HorizontalTextAlignment="Center" 
                        VerticalTextAlignment="Center"/>
                </Grid>
            </mobile:MobileCard>
            
            <Grid views:DockLayout.Dock="Top" Margin="0,5,0,0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="40"/>
                    <ColumnDefinition Width="*"/>
                    <ColumnDefinition Width="40"/>
                </Grid.ColumnDefinitions>
                
                <mobile:MobileButton
                    x:Name="ProductSearch"
                    Grid.Column="0"
                    Image="stock_search"
                    Clicked="ProductSearch_Clicked" />
                
                <mobile:MobileCard
                    Grid.Column="1">
                    <Label 
                        Text="{Binding FoundItem}" 
                        VerticalTextAlignment="Center" 
                        HorizontalTextAlignment="Center"
                        TextColor="{StaticResource Theme.OnBackground}"/>
                </mobile:MobileCard>
                
                <mobile:MobileButton
                    x:Name="LocationSearch"
                    Grid.Column="2"
                    Image="warehouse"
                    Clicked="LocationSearch_Clicked" />
                
            </Grid>
            
            <mobile:MobileListView
                views:DockLayout.Dock="Top"
                x:Name="_items"
                PullToRefresh="False"
                ShowRecordCount="False"
                Margin="0,5,0,0" 
                ItemsSource="{Binding Holdings.Items}"/>
            
        </views:DockLayout>
    </mobile:MobilePage.PageContent>
</mobile:MobilePage>