首页 文章

键盘提升底部按钮

提问于
浏览
1

我需要在屏幕底部有一个按钮,但是一旦我点击文本字段,键盘就会显示并用它提起按钮 . 我尝试过使用一个按钮,另一个stacklayout,一个包含它的滚动视图......没有任何工作,我觉得我不能正确理解布局 .

这是灰色按钮 - > I want the gray button there

但它总是出现在键盘上,see?

这是我的理解,这应该是一个scrollview,所以它保持在它的底部位置,但如果我将一个ScrollView添加到gridLayout所以它滚动,它不起作用 .

这是代码 . 先感谢您 .

<ActionBar android:title="Entrega {{id}}/{{detalleRuta.delegacion}}/{{detalleRuta.tipoAlbaran}}">
    <ActionItem>
        <Label *ngIf="!entrega.foto" cssClass="mdi icon-cam" [text]="'mdi-add-a-photo' | fonticon" ios.position="right" (tap)="getFoto()"></Label>
        <Label *ngIf="entrega.foto" cssClass="mdi icon-cam" [text]="'mdi-photo' | fonticon" ios.position="right" (tap)="showFoto()"></Label>
    </ActionItem>   
    <ActionItem>
        <Label class="mdi icon-map" [text]="'mdi-event-busy' | fonticon" ios.position="right" (tap)="cancelarEntrega()"></Label>
    </ActionItem>
</ActionBar>
<GridLayout rows="auto,*, 50" loaded="pageLoaded">
    <ListView row="0" [items]="detalle">
        <template let-item="item">
            <StackLayout orientation="vertical" class="info-entrega">
                <Label *ngIf="item.fechaActual" [text]="'Fecha ' + item.fechaActual"></Label>
                <Label *ngIf="item.horaActual"  [text]="'Hora ' + item.horaActual"></Label>
            </StackLayout>
        </template>
    </ListView>
    <TabView row="1" selectedIndex="0" selectedColor="#00B4E6" *ngIf="!noEntregado">
        <StackLayout *tabItem="{title: 'Cliente'}">
        <ScrollView>
            <StackLayout class="formulario">
                <TextField [(ngModel)]="entrega.nombreCliente" hint="Nombre Cliente" keyboardType="text" autocorrect="false" autocapitalizationType="none"></TextField>
                <TextField [(ngModel)]="entrega.DNICliente" hint="DNI Cliente" keyboardType="text" autocorrect="false" autocapitalizationType="none"></TextField>
                <TextField [(ngModel)]="entrega.emailCliente" hint="Email Cliente" keyboardType="email" autocorrect="false" autocapitalizationType="none"></TextField>
                <Button style="width:100%" class="btn {{ entrega.firmaCliente ? 'conFirma' : 'sinFirma' }}" text="Firma Cliente" (tap)="firmaCliente(false)"></Button>
            </StackLayout>
        </ScrollView>
        </StackLayout>
        <StackLayout *tabItem="{title: 'Empleado'}">
        <ScrollView>
            <StackLayout class="form-config">
                <TextField class="input-config" [(ngModel)]="entrega.nombreEmpleado" hint="Nombre Empleado" keyboardType="text" autocorrect="false" autocapitalizationType="none"></TextField>
                <TextField class="input-config" [(ngModel)]="entrega.DNIEmpleado" hint="Dni Empleado" keyboardType="text" autocorrect="false" autocapitalizationType="none"></TextField>
                <Button style="width:100%" cssClass="btn {{ entrega.firmaEmpleado ? 'conFirma' : 'sinFirma' }}" text="Firma Empleado" (tap)="firmaEmpleado(false)"></Button>
            </StackLayout>
        </ScrollView>
        </StackLayout>
        <StackLayout *tabItem="{title: 'Importes'}">
        <ScrollView *ngIf="detalleRuta.importePdte != 0">
            <StackLayout class="form-config">
                <StackLayout>
                    <Label *ngIf="entrega.impMetalico" class="impMetalico" [text]="'Metálico ' + impMetalicoCurrency"></Label>
                    <TextField id="impMetalico" keyboardType="number" [(ngModel)]="entrega.impMetalico" hint="Importe en Metálico" (textChange)="cambioMetalico($event)"></TextField>
                </StackLayout>

                <StackLayout>
                    <Label *ngIf="entrega.impTarjeta" class="impTarjeta" [text]="'Tarjeta ' + impTarjetaCurrency"></Label>
                    <TextField id="impTarjeta" keyboardType="number" [(ngModel)]="entrega.impTarjeta" hint="Importe en Tarjeta" (textChange)="cambioTarjeta($event)"></TextField>
                </StackLayout>

                 <StackLayout>
                    <Label *ngIf="entrega.impVale" class="impVale" [text]="'Vale ' + impValeCurrency"></Label>
                    <TextField id="impVale" keyboardType="number" [(ngModel)]="entrega.impVale" hint="Importe en Vale" (textChange)="cambioVale($event)"></TextField>
                </StackLayout>

                <StackLayout>
                    <Label *ngIf="entrega.impOtros" class="impOtros" [text]="'Otros ' + impOtrosCurrency"></Label>
                    <TextField id="impOtros" keyboardType="number" [(ngModel)]="entrega.impOtros" hint="Importe en Otros" (textChange)="cambioOtros($event)"></TextField>
                </StackLayout>

                <StackLayout>
                    <Label *ngIf="entrega.total" class="total" [text]="'Total ' + totalCurrency"></Label>
                </StackLayout>

                <StackLayout class="sumTotal">
                    <Label *ngIf="sumTotal" class="total" [text]="'Total ' + sumTotal | myCurrency"></Label>
                </StackLayout>
            </StackLayout>
        </ScrollView>
        <StackLayout *ngIf="detalleRuta.importePdte == 0">
            <Label class="sinImporte" text="El importe Pendiente es de 0€"></Label>
        </StackLayout>
        </StackLayout>
    </TabView>
    <Button row="2" *ngIf="!noEntregado" class="btn" text="Confirmar Entrega" (tap)="submit()"></Button>

    <StackLayout row="1" *ngIf="noEntregado">
    <ScrollView class="scrollView">
        <StackLayout class="form-config">
            <Label *ngIf="desc" class="desc" text="{{desc}}"></Label>
            <Button style="width:100%" text="Motivo" (tap)="getMotivos()"></Button>
            <StackLayout class="input-field">
                <TextView hint="Observación." returnKeyType="send" [(ngModel)]="entrega.obsNoEntrega" editable="true" class="input input-border"></TextView>
            </StackLayout>
            <Button class="btn" text="Cancelar Entrega" (tap)="cancel()"></Button>
        </StackLayout>
    </ScrollView>
    </StackLayout>
</GridLayout>
<ActivityIndicator class="activity-indicator" width="100" [busy]="isLoading" height="100"></ActivityIndicator>

1 回答

  • 0

    这就是我管理我的键盘以便在文本字段获得焦点时不按下按钮的方式 .

    <StackLayout>
    <ScrollView >
    <CardView shadowColor="#FE00FC" elevation="20" id="container" row="1">
        <GridLayout rows="auto auto auto auto auto auto auto">
            <TextField row="1" hint="User Name" keyboardType="email" autocorrect="false" autocapitalizationType="none" returnKeyType="next" [(ngModel)]="user.name"></TextField>
            <TextField row="2" hint="Password" id="pass" keyboardType="email" secure="true" [(ngModel)]="user.password"></TextField>
    
            <Button row="3" text="Login" class="submit-button" (tap)="submit()"></Button>
        </GridLayout>
    </CardView>
    </ScrollView>
    </StackLayout>
    

相关问题