Como implementar tabview personalizada no Visualizador Android?

Posso perguntar como podemos implementar o seguinte layout usando Verpager no Android:

1) Vista Desejada

2)técnicas / métodos experimentados:

existe uma actividade com o visor e um FragmentPagerAdapter para devolver o fragmento apropriado para cada página. Eu tentei as seguintes respostas / biblioteca:

páginas personalizadas do Visualizador com vista personalizada, fragmentos múltiplos e disposições

visualizador em Android com páginas fixas no fundo com ícone e texto em cada página

Http://viewpagerindicator.com/

também tento definir o estilo de Acção no tema de aplicações, mas todas as regras se aplicam à barra de acções, não à janela de páginas do paginador de vistas.

<style name="MyTheme" parent="android:Theme.Holo.Light">
        <item name="android:actionBarStyle">@style/MyCustomActionBar</item>
        <item name="android:actionBarTabStyle">@style/ActionBarTabStyle</item>
        <item name="android:actionBarSize">100dp</item>
    </style>

    <style name="ActionBarTabStyle" parent="@android:style/Widget.Holo.ActionBar.TabView">
        <item name="android:minHeight">200dp</item>
    </style>


    <style name="MyCustomActionBar" parent="@android:style/Widget.Holo.Light.ActionBar">
        <item name="android:background">@color/white</item>
        <item name="android:height">100dp</item>
    </style>

3) Vista Actual:

esta é a página actual do visualizador, que não é bonita:

4) XML disposição:

esquema da actividade:

<android.support.v4.view.ViewPager
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/pager"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
   />

disposição dos fragmentos das correntes:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/new_deliver_scroll"
    >
<LinearLayout  android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"

    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:background="@color/background_material_light"
    android:id="@+id/newDeliverMain"
    >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:id="@+id/new_deliver_main_linear"
    >
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="20dp"
        android:orientation="horizontal"
        android:id="@+id/relative_layout_item_info"
        >

        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="@string/Item_desc"
            android:id="@+id/new_deliver_item_desc_text"
            android:textColor="@color/app_blue"

            />

...........

5) código para criar uma tabview personalizada na actividade:

viewPagerAdapter = new SenderViewPagerAdapter( getSupportFragmentManager());
        viewPager = (ViewPager) findViewById(R.id.pager);

        viewPager.setAdapter( viewPagerAdapter);

        actionBar = getActionBar();
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
        viewPager.setOnPageChangeListener(
                new ViewPager.SimpleOnPageChangeListener() {
                    @Override
                    public void onPageSelected(int position) {
                        actionBar.setSelectedNavigationItem(position);
                    }
                    @Override
                    public void onPageScrolled(int arg0, float arg1, int arg2) {
                    }
                    @Override
                    public void onPageScrollStateChanged(int arg0) {
                    }
                });
        for (int i = 0; i < viewPagerAdapter.getCount(); i++) {

            ActionBar.Tab newTab = actionBar.newTab();
            newTab.setCustomView(R.layout.custom_actionbar);
            newTab.setTabListener(this);

            TextView title = (TextView) newTab.getCustomView().findViewById(R.id.tab_title);
            ImageView icon = (ImageView)newTab.getCustomView().findViewById(R.id.tab_icon);
            title.setText(viewPagerAdapter.getPageTitle(i));
            icon.setImageResource(ICONS[i]);
            actionBar.addTab(newTab);
       }

Depois de vários julgamentos, fiquei temporariamente aqui. Qualquer ideia , sugestões como implementar a vista desejada seria muito apreciada. Muito obrigado.

6) actualizar

não trabalhar com:
icone.setLayoutParams(novo LinearLayout.LayoutParams (LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);

@refer to @karaokyo answer: Eu mudo para usar o botão de rádio em vez de barra de ação, ele funciona ok, apenas mais algumas personalizações.

mudar de imagem quando verificar:

Drawable top = getResources().getDrawable(R.drawable.image);
button.setCompoundDrawablesWithIntrinsicBounds(null, top , null, null);

para o botão de rádio, é muito difícil mudar o tamanho da imagem de cima programaticamente, melhor redimensionar a imagem em si > demore-me 2 horas para descobrir.