Xamarin Forms中ZXingBarcodeImageView加载时Bool绑定失效问题

问题根源 #

ZXingBarcodeImageView在初始加载时，若IsVisible直接设为true且格式为CODE_128，存在渲染触发延迟或布局计算异常的问题，导致条形码无法生成显示；而切换操作触发了控件的属性变更通知，强制重新渲染，因此功能恢复正常。QR_CODE无此问题是因为其编码逻辑和布局适配的初始处理更稳定。

解决方案 #

方案1：优化CODE_128的编码选项与布局约束

你给CODE_128设置了Width="1920" Height="1080"的超大尺寸，远超常规视图范围，可能导致初始渲染时控件无法正确计算布局，进而不生成条形码。调整为更合理的尺寸，并添加布局约束：

修改View中CODE_128的EncodingOptions：

<zxcm:EncodingOptions Width="300" Height="100" Margin="20" />

同时移除Rotation="90"（若不需要旋转），或确保旋转后的尺寸仍在视图范围内。

方案2：手动触发条形码生成

在View的代码后台，监听ViewModel的Is128属性变更，当初始值为true时，强制刷新CODE_128控件的条形码：

假设View的类名为BarcodePage，添加以下代码：

using Xamarin.Forms;
using ZXing.Net.Mobile.Forms;

public partial class BarcodePage : ContentPage
{
    public BarcodePage()
    {
        InitializeComponent();
        BindingContextChanged += OnBindingContextChanged;
    }

    private void OnBindingContextChanged(object sender, EventArgs e)
    {
        if (BindingContext is BarcodeViewModel vm)
        {
            if (vm.Is128)
            {
                // 给CODE_128控件添加x:Name="Code128Barcode"
                Code128Barcode.IsVisible = false;
                Code128Barcode.IsVisible = true;
                // 或直接调用生成方法
                Code128Barcode.GenerateBarcode();
            }
        }
    }
}

方案3：改用单控件切换BarcodeFormat（推荐）

放弃两个控件的可见性切换，改为绑定BarcodeFormat属性，只需维护一个控件，从根源避免双控件的初始渲染问题：

修改ViewModel：

using ZXing;

private BarcodeFormat _currentFormat;
public BarcodeFormat CurrentFormat
{
    get => _currentFormat;
    set => SetProperty(ref _currentFormat, value);
}

public ICommand ToggleCode { private set; get; }

public BarcodeViewModel()
{
    CurrentFormat = BarcodeFormat.CODE_128; // 初始显示CODE_128
    ToggleCode = new Command(ToggleCodeHandler);
}

private void ToggleCodeHandler()
{
    CurrentFormat = CurrentFormat == BarcodeFormat.CODE_128 
        ? BarcodeFormat.QR_CODE 
        : BarcodeFormat.CODE_128;
}

修改View：

<Grid x:DataType="vm:BarcodeViewModel">
    <!-- Label和Button保持不变 -->
    <zxing:ZXingBarcodeImageView Grid.Row="2"
                                 BarcodeValue="{Binding Code}" 
                                 BarcodeFormat="{Binding CurrentFormat}"
                                 VerticalOptions="Center"
                                 HorizontalOptions="Center">
        <zxing:ZXingBarcodeImageView.BarcodeOptions>
            <!-- 设置通用适配的尺寸，或根据格式动态调整 -->
            <zxcm:EncodingOptions Width="300" Height="300" />
        </zxing:ZXingBarcodeImageView.BarcodeOptions>
    </zxing:ZXingBarcodeImageView>
</Grid>

这种方式不仅解决了初始渲染问题，还简化了代码结构，减少了控件冗余。

验证建议 #

优先测试方案3，因为它从架构上优化了实现方式，避免了双控件带来的潜在问题；若必须保留双控件结构，可尝试方案1+方案2的组合，先调整尺寸再强制刷新。

内容的提问来源于stack exchange，提问作者Somachr