Custom Field into Custom Form

Question

I created a custom field to read qr codes from camera and it's working fine. Now I want to use this field or field widget in a custom form on the same custom module. Is it possible? Thank you,

Field Formatter

namespace Drupal\hospitator_qr_decode\Plugin\Field\FieldFormatter;

use Drupal\Core\Field\FieldItemListInterface;
use Drupal\Core\Field\FormatterBase;

/**
 * Plugin implementation of the 'hospitator_qr_decode_formatter_type' formatter.
 *
 * @FieldFormatter(
 *   id = "hospitator_qr_decode_formatter",
 *   label = @Translation("Hospitator QR Decode field formatter"),
 *   field_types = {
 *     "hospitator_qr_decode_field_type"
 *   }
 * )
 */
class HospitatorQrDecodeFormatterType extends FormatterBase {

  /**
   * {@inheritdoc}
   */
  public function viewElements(FieldItemListInterface $items, $langcode) {}

}

Field Type

namespace Drupal\hospitator_qr_decode\Plugin\Field\FieldType;

use Drupal\image\Plugin\Field\FieldType\ImageItem;
use Drupal\Core\Form\FormStateInterface;
use Drupal\Core\SNcEH1C3UXSaTcNMHNLGNuLZqjGKbSrEMZce;
use Drupal\Core\TypedData\DataDefinition;

use Drupal\Core\Field\FieldStorageDefinitionInterface;

/**
 * Plugin implementation of the 'image' field type.
 *
 * @FieldType(
 *   id = "hospitator_qr_decode_field_type",
 *   label = @Translation("Hospitator QR decoder"),
 *   description = @Translation("This field stores the ID of an image file from webcam as an integer value."),
 *   category = @Translation("Reference"),
 *   default_widget = "hospitator_qr_decode_widget",
 *   default_formatter = "image",
 *   column_groups = {
 *     "file" = {
 *       "label" = @Translation("File"),
 *       "columns" = {
 *         "target_id", "width", "height"
 *       },
 *       "require_all_groups_for_translation" = TRUE
 *     },
 *     "code" = {
 *       "label" = @Translation("Hospitator QR code decoder"),
 *       "translatable" = TRUE
 *     },
 *   },
 *   list_class = "\Drupal\file\Plugin\Field\FieldType\FileFieldItemList",
 *   constraints = {"ReferenceAccess" = {}, "FileValidation" = {}}
 * )
 */
class HospitatorQrDecodeItem extends ImageItem {


  /**
   * {@inheritdoc}
   */
  public static function schema(FieldStorageDefinitionInterface $field_definition) {}

  /**
   * {@inheritdoc}
   */
  public static function propertyDefinitions(FieldStorageDefinitionInterface $field_definition) {}

  /**
   * {@inheritdoc}
   */
  public function fieldSettingsForm(array $form, FormStateInterface $form_state) {}

  /**
   * {@inheritdoc}
   */
  public function storageSettingsForm(array &$form, FormStateInterface $form_state, $has_data) {}

}

Field Widget

namespace Drupal\qr_decode\Plugin\Field\FieldWidget;

use Drupal\Core\Field\FieldItemListInterface;
use Drupal\Core\Form\FormStateInterface;
use Drupal\image\Plugin\Field\FieldWidget\ImageWidget;
use Drupal\hospitator_qr_decode\Plugin\Field\FieldType\HospitatorQrDecodeItem;

use Zxing\QrReader;

/**
 * Plugin implementation of the 'hospitator_qr_decode_widget_type' widget.
 *
 * @FieldWidget(
 *   id = "hospitator_qr_decode_widget",
 *   label = @Translation("Hospitator Qr code widget"),
 *   field_types = {
 *     "hospitator_qr_decode_field_type"
 *   }
 * )
 */
class HospitatorQrDecodeWidget extends ImageWidget {


  /**
   * {@inheritdoc}
   */
  public function formElement(FieldItemListInterface $items, $delta, array $element, array &$form, FormStateInterface $form_state) {}

  /**
   * Form API callback: Processes a image_image field element from webcam.
   *
   * Expands the image_image type to include the alt and title fields.
   *
   * This method is assigned as a #process callback in formElement() method.
   */
  public static function process($element, FormStateInterface $form_state, $form) {}
}

And the custom Form

/**
 * @file
 * Contains \Drupal\hospitator_user_interface\Form\TimeTrackerForm.
 */
namespace Drupal\hospitator_user_interface\Form;

use Drupal\Core\Form\FormBase;
use Drupal\Core\Form\FormStateInterface;

class TimeTrackerForm extends FormBase {
  /**
   * {@inheritdoc}
   */
  public function getFormId() {
    return 'time_tracker_form';
  }

  /**
   * {@inheritdoc}
   */
  public function buildForm(array $form, FormStateInterface $form_state) {

    $form['clock'] = array(
      '#type' => 'checkboxes',
      '#options' => array(
        'clock_in' => $this->t('Clock In'),
        'clock_out' => $this->t('Clock Out')),
      '#title' => $this->t('Select Clock Status'),
      '#required' => TRUE,
    );    

    $form['actions']['#type'] = 'actions';
    $form['actions']['submit'] = array(
      '#type' => 'submit',
      '#value' => $this->t('Send'),
      '#button_type' => 'primary',
    );
    return $form;
  }

  /**
   * {@inheritdoc}
   */
  public function submitForm(array &$form, FormStateInterface $form_state) {
    if($form_state->getValue('clock')){
      drupal_set_message($this->t('Clock In submitted!'));
    }
    else{
      drupal_set_message($this->t('Clock Out submitted!'));
    }
  }
}

I just want to include my custom field and widget into my custom form.

Answer 1

Finally I solved the problematic creating an empty representative entity form time_tracker and got the widget with EntityFormDisplay.

$node = \Drupal::service('entity_type.manager')->getStorage('node')->create(array('type' => 'time_tracker'));

$entity_form_display = \Drupal::service('entity_type.manager')->getStorage('entity_form_display')->load('node.time_tracker.default');

if ($widget = $entity_form_display->getRenderer('field_clock')) { 

  $items = $node->get('field_clock'); 
  $items->filterEmptyItems();

  $form['tracker'] = $widget->form($items, $form, $form_state);
}