Benutzerdefinierte Android-pin-code-Eingabe-widget

Ich versuche zum erstellen einer benutzerdefinierten pin-code-widget für android als alternative zu nur mit einem EditText mit einem Passwort inputType Attribut. Das, was ich möchte-display ist eine Reihe von Feldern, und jedes Feld ausgefüllt werden, während der Benutzer tippt seine pin.

Jemand so etwas Tat, aber es stellte sich heraus, dass eine Feste Anzahl von EditText Ansichten und es war eine Menge hässlich code für das austauschen konzentrieren als Zeichen wurden eingegeben oder gelöscht. Dies ist NICHT der Ansatz, den ich nehmen will; vielmehr bin ich der Gestaltung meiner anpassbare Länge (einfach) und Verhalten sich wie ein einzelnes Isoliertes Ansicht (nicht so einfach).

Mein Konzept so weit ist eine Art hybrid zwischen einem LinearLayout (halten Sie die "Boxen") und eine EditText (zum speichern wird die Eingabe des Benutzers).

Dies ist der code so weit...

public class PinCodeView extends LinearLayout {
    protected static final int MAX_PIN_LENGTH = 10;
    protected static final int MIN_PIN_LENGTH = 1;

    protected int pinLength;
    protected EditText mText;

    public PinCodeView(Context context, AttributeSet attrs) {
        super(context, attrs);

        TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.PinCodeView);
        try {
            pinLength = a.getInt(R.styleable.PinCodeView_pinLength, 0);
        } finally {
            a.recycle();
        }

        pinLength = Math.min(pinLength, MAX_PIN_LENGTH);
        pinLength = Math.max(pinLength, MIN_PIN_LENGTH);

        setupViews();

        Log.d(TAG, "PinCodeView initialized with pinLength = " + pinLength);
    }

    private void setupViews() {
        LayoutInflater inflater = (LayoutInflater) getContext().getSystemService(
                Context.LAYOUT_INFLATER_SERVICE);
        for (int i = 0; i < pinLength; i++) {
            //inflate an ImageView and add it
            View child = inflater.inflate(R.layout.pin_box, null, false);
            addView(child);
        }
    }

    public CharSequence getText() {
        //TODO return pin code text instead
        return null;
    }

    public int length() {
        //TODO return length of typed pin instead
        return pinLength;
    }

    @Override
    public boolean onCheckIsTextEditor() {
        return true;
    }

    @Override
    public InputConnection onCreateInputConnection(EditorInfo outAttrs) {
        //TODO return an InputConnection
        return null;
    }
}

Über diese überschreibungen: onCheckIsTextEditor() sollte true zurückgeben, und onCreateInputConnection(EditorInfo outAttrs) zurückkehren sollte, eine neue InputConnection Objekt zum interagieren mit einem InputMethod (eine Tastatur), aber das ist alles was ich weiß.

Weiß jemand, ob ich auf dem richtigen Weg? Hat jemand gemacht der Arbeit mit InputConnection vor oder Ihre eigene editierbare Ansichten können eine Orientierung geben?

(Edit 1)
Nach einem Blick auf das etwas mehr, es scheint, ich sollte Unterklasse BaseInputConnection und liefern TextView oder EditText als Ziel:

    @Override
    public InputConnection onCreateInputConnection(EditorInfo outAttrs) {
        if (!onCheckIsTextEditor()) {
            return null;
        }
        return new BaseInputConnection(mText, true);
    }

Vorausgesetzt, dieser speichert den text wie er eingegeben wurde, muss ich trotzdem in gewisser Weise zum aktualisieren der Ansichten zu reflektieren, die Inhalte zu ändern,...

(Edit 2)
Also ich habe diese benutzerdefinierte Ansicht, um einen Bildschirm für die Prüfung. Es zeigt die Anzahl der Boxen, und die ganze Ansicht ist Isoliertes, aber die Tastatur nie erscheint. Ich weiß, es gewinnt/verliert den Fokus, weil die Boxen zeigen die Hervorhebung angemessen und ich ein OnFocusChangedListener zu schreiben logcat.

Was macht eine tatsächliche Tastatur angezeigt, wenn Sie eine editierbare Ansicht dauert Fokus?

InformationsquelleAutor Karakuri | 2012-05-10

Schreibe einen Kommentar